/*
This file is a part of the Glitchipedia
(C) GlitchBuddy
*/

/* Glitchipedia main stylesheet */

/* Custom font faces */
/* "Pixelated Elegance" by GGBotNet
    Released under the public domain (CC0 1.0 Universal) 
    https://ggbot.itch.io/pixelated-elegance-font */
@font-face {
    font-family: "PixelatedElegance";
    src: url("/resources/fonts/pixelated_elegance.woff2") format("woff2");
}

/* Body text */
body {
  background-color: #202020;
  color: #00c9fd;
  font-family: PixelatedElegance, sans-serif;
  margin-left: 100px;
  margin-right: 250px;
  margin-top: 100px;
  margin-bottom: 50px;
  font-size: 28px;
}
.smalltext {font-size: 20px;}

/* Links */
a:link {color: #ff9900;}
a:visited {color: #ca87ff;}
nav a:link {
  color: #b9b9b9;
  padding-left: 0px;
  padding-right: 16px;
  text-decoration: none;
}
nav a:visited {color: #b9b9b9;}
nav a:hover {color: #878787;}
.main_site:link {color: #00c9fd;}
.main_site:visited {color: #00c9fd;}
.main_site:hover {color: #009fc6;}

/* Footer */
footer {
  display: flex;
  justify-content: space-between;
  align-items: end;
  font-size: 24px;
}
.footer-left p:last-child {
  margin-bottom: 0;
}
.footer-right img {display: block;}

/* Replacement rules for smart devices */
@media screen and (max-width: 800px) {

  /* Define smaller margins to use the smart device's full width */
  body {
    margin: 10px;
    margin-top: 30px;
  }

  /* Use full width of screen for images and make them appear independent of text */
  img {
    float: none;
    height: 100%;
    width: 100%;
  }

  /* Set logo's maximum width so it doesn't appear huge on tablet screens */
  .logo {max-width: 480px}

  /* Centre text and Neocities button in footer */
  footer {
    display: block;
    text-align: center;
  }
  .neocities {
    margin-left: auto;
    margin-right: auto;
    padding-top: 30px;
    padding-bottom: 20px;
    width: 200px;
  }

}

/* End of CSS */