/* GUNDAM EVOLUTION FANSITE STYLE SHEET - MEGAERICZERO on NEOCITIES */

body
 {
  align-items:start;
  background-color:midnightblue;
  background-image:url('images/grid_light.png');
  color:white;
  display:grid;
  font-family:Arial;
  grid-template-columns:10rem 1fr;
  margin:0 auto;
  width:min(150vh,100%);
 }

footer
 {
  background-color:black;
  bottom:0;
  font-size:0.8rem;
  grid-column:span 2;
  left:0;
  padding:0.5rem 1rem;
  position:sticky;
  right:0;
  z-index:2;
 }

main
 {
  background-color:#00000080;
  display:flex;
  flex-direction:column;
  gap:1rem;
  padding:2rem;
 }

nav
 {
  background-color:#00000080;
  border-radius:0.5rem;
  display:flex;
  flex-direction:column;
  font-size:0.8rem;
  gap:0.5rem;
  margin:0.5rem;
  padding:0.5rem;
 }

nav a { text-decoration:none; }

nav hr
 {
  background-color:white;
  border:0;
  height:1px;
  width:90%;
 }

p { margin:0; }

.nav-link
 {
  background-color:#ffffff40;
  border-radius:0.25rem;
  color:white;
  padding:0.25rem 0.5rem;
  text-align:center;
  text-decoration:none;
 }
.nav-link:hover { background-color:#ffffff80; }

.skill-icon
 {
  background-color:black;
  border:1px solid white;
  float:right;
  margin:0 0 1rem 1rem;
 }

.skill-name
 {
  border-bottom:1px solid white;
  font-size:1rem;
  font-weight:bold;
  margin:0;
  padding:0 0 0.125rem;
 }

.skill-text:not(:first-of-type):before { margin-top:1rem; }

.skill-text:before
 {
  background-color:#ffffff40;
  border:1px solid white;
  border-radius:0.2rem;
  display:block;
  font-size:0.7rem;
  margin-bottom:0.5rem;
  text-align:center;
  width:5rem;
 }

.skill-main:before    { content:'Main'; }
.skill-sub:before     { content:'Sub'; }
.skill-skill:before   { content:'Skill'; }
.skill-g:before       { content:'G-Maneuver'; }
.skill-passive:before { content:'Passive'; }

.unit-model
 {
  font-size:1rem;
  margin:0;
 }

.unit-name
 {
  border-bottom:3px double white;
  font-size:2rem;
  margin:0;
 }

.unit-portrait
 {
  aspect-ratio:16/9;
  background-position:center top;
  background-repeat:no-repeat;
  background-size:contain;
  position:relative;
 }

.unit-difficulty
 {
  font-size:0.9rem;
  margin:0;
  position:absolute;
  top:0;
 }
.unit-difficulty:before
 {
  content:'Difficulty';
  font-weight:bold;
  margin-right:1rem;
 }

.unit-profile
 {
  background-color:#00000080;
  border:2px dashed white;
  display:flex;
  flex-direction:column;
  gap:0.5rem;
  padding:1rem;
 }

.unit-source
 {
  border-top:1px dotted white;
  font-size:0.9rem;
  padding-top:0.5rem;
 }
.unit-source:before
 {
  content:'Source Title';
  font-weight:bold;
  margin-right:1rem;
 }

.unit-stat
 {
  background-color:#00000080;
  border:1px solid white;
  display:flex;
  gap:1rem;
  padding:0.25rem 0.5rem;
 }
.unit-stat:before
 {
  font-weight:bold;
 }

.unit-range:before { content:'RANGE'; }
.unit-health:before { content:'HEALTH'; }
.unit-dashes:before { content:'DASHES'; }
.unit-shield:before { content:'SHIELD'; }
.unit-transform:before { content:'TRANSFORMATION'; }

.unit-stats
 {
  bottom:0;
  display:flex;
  font-size:0.9rem;
  gap:1rem;
  position:absolute;
 }

#home-link
 {
  border:solid gold;
  border-radius:0.25rem;
  border-width:0 0.125rem;
  color:gold;
  font-size:1.25rem;
  font-weight:bold;
  text-align:center;
  text-shadow:1px 1px 0 black,1px -1px 0 black,-1px 1px 0 black,-1px -1px 0 black;
 }
#home-link:hover
 {
  border-color:yellow;
  color:yellow;
 }

/* END STYLE SHEET */