/* 
  PRIME MARKET STYLESHEET V1.0 (BETA? ALPHA? OMEGA?)
  DO NOT TOUCH THIS FILE UNLESS YOU KNOW WHAT YOU ARE DOING.
  AND EVEN IF YOU DO, DON'T TOUCH IT.
*/

body {
  background-color: #111827; /* dark like my soul */
  color: #e6edf3;
  font-family: 'Courier New', Courier, monospace; /* websafe only pls */
  margin: 0;
  padding: 0;
  overflow-x: hidden; /* horizontal scroll is for losers */
  line-height: 1.4;
}

/* Why is this here? I don't know but it breaks if I remove it */
.wrapper-container-box-thing {
  max-width: 960px;
  margin: 0 auto;
  padding: 20px;
  border-left: 1px dashed #2b3a4a;
  border-right: 1px dashed #2b3a4a;
}

h1, h2, h3, h4 {
  font-family: 'Times New Roman', Times, serif; /* classy */
  text-transform: uppercase;
  letter-spacing: -1px;
}

h1 {
  color: #2d8cff;
  font-size: 3em;
  text-shadow: 2px 2px 0px #1f2937;
  transform: rotate(-1deg); /* artistic tilt */
  margin-bottom: 0.2em;
}

/* Make links look like links from 1999 */
a {
  color: #2d8cff;
  text-decoration: underline;
  cursor: help; /* confuses the user, good */
}

a:hover {
  color: #3b9cff;
  background-color: #1f2937;
  text-decoration: none;
}

/* The box where the onion lives */
.onion-zone {
  background-color: #233043;
  border: 3px double #f7931a;
  padding: 15px;
  margin: 20px 0;
  text-align: center;
  font-weight: bold;
  box-shadow: 5px 5px 0px #000;
}

.onion-link {
  font-family: monospace;
  color: #f7931a;
  font-size: 1.2em;
  word-break: break-all;
}

/* Buttons that scream "CLICK ME OR ELSE" */
button {
  background-color: #2d8cff;
  color: #e6edf3;
  border: 2px solid #e6edf3;
  padding: 10px 20px;
  font-family: inherit;
  cursor: pointer;
  transition: all 0.1s;
}

button:active {
  transform: translate(2px, 2px);
}

/* Intentionally bad layout for nav */
nav {
  background: #1f2937;
  border-bottom: 5px solid #2d8cff;
  padding: 10px;
  margin-bottom: 30px;
}

nav ul {
  list-style-type: square;
  padding: 0;
  margin: 0;
  text-align: right; /* why right? why not */
}

nav li {
  display: inline-block;
  margin-left: 20px;
  transform: skewX(-10deg);
}

nav a {
  font-size: 1.1em;
  color: #e6edf3;
  text-decoration: none;
  border-bottom: 1px dotted #f7931a;
}

/* Content boxes */
.content-blob {
  background-color: #1f2937;
  border: 1px solid #2b3a4a;
  padding: 25px;
  margin-bottom: 30px;
  position: relative;
}

/* Random glitch effect */
.content-blob::after {
  content: "";
  position: absolute;
  top: 5px;
  left: 5px;
  width: 100%;
  height: 100%;
  border: 1px solid #2d8cff;
  z-index: -1;
  pointer-events: none;
}

/* Tables from hell */
table {
  width: 100%;
  border-collapse: collapse;
  margin: 20px 0;
  background-color: #111827;
}

th, td {
  border: 1px solid #2b3a4a;
  padding: 8px;
  text-align: left;
}

th {
  background-color: #233043;
  color: #f7931a;
}

/* Images should look pasted in */
img {
  max-width: 100%;
  border: 5px solid #1f2937;
  display: block;
  margin: 10px auto;
  filter: contrast(120%) sepia(10%); /* retro filter */
}

/* The footer. A graveyard of information. */
footer {
  margin-top: 50px;
  padding: 20px;
  border-top: 10px solid #2b3a4a;
  text-align: center;
  font-size: 0.8em;
  color: #9aa9bb;
}

/* Zig-zag text helper */
.zig-zag {
  margin-left: 20px;
}
.zig-zag-more {
  margin-left: 40px;
}
.zig-zag-most {
  margin-left: 60px;
}

/* Utility for random stuff */
.warning-text {
  color: #f7931a;
  font-weight: bold;
  text-decoration: blink; /* sadly deprecated but we can dream */
  animation: blinker 1s linear infinite;
}

@keyframes blinker {
  50% { opacity: 0; }
}

/* Don't look at this media query, it's hideous */
@media (max-width: 600px) {
  h1 { font-size: 2em; }
  nav li { display: block; text-align: left; margin: 10px 0; }
  .wrapper-container-box-thing { border: none; }
}