/* CITY WATCH STYLE SHEET - MEGAERICZERO */

html { font-size:3vw; }

@media (pointer:fine) {
 html { font-size:min(1.5vw,1.5vh); }
 body { max-width:100vh; }
}

a { text-decoration:none; }
a:hover { opacity:0.8; }

body
 {
  background-color:#000080;
  color:white;
  display:flex;
  flex-direction:column;
  font-family:Arial;
  margin:0 auto;
  padding:0 1rem;
 }

footer, header, main
 {
  background-color:#00000080;
  padding:2rem;
 }

nav
 {
  display:grid;
  gap:1.5rem;
  grid-template-columns:1fr 1fr 1fr 1fr;
 }

#page-title
 {
  background-clip:text;
  background-image:linear-gradient(yellow,gold,orange);
  color:transparent;
  font-size:2rem;
  font-style:italic;
  font-weight:bold;
  margin:0;
  text-align:center;
  -webkit-background-clip:text;
 }

.char-portrait
 {
  aspect-ratio:3/4;
  background-position:center top;
  background-repeat:no-repeat;
  background-size:cover;
  float:right;
  margin:0 0 2rem 2rem;
  width:40%;
 }

.nav-link
 {
  aspect-ratio:3/4;
  background-position:center top;
  background-repeat:no-repeat;
  background-size:cover;
  display:block;
  position:relative;
 }

.nav-link-text
 {
  background-color:#000000aa;
  bottom:0;
  color:white;
  font-weight:bold;
  left:0;
  padding:1rem;
  position:absolute;
  right:0;
  text-shadow:1px 1px 0 black,1px -1px 0 black,-1px 1px 0 black,-1px -1px 0 black;
  white-space:nowrap;
 }

/* END STYLE SHEET */