:root, body{
	margin: 0;
}
@keyframes blink{
	0% {
		opacity: 0;
	}
	50% {
		opacity: 1;
	}
	100% {
		opacity: 0;
	}
}
body{
	color: white;
	background: black;
	background: url("/media/bg.svg"), linear-gradient(0deg, rgb(13, 133, 192) 0%, rgb(4, 9, 59) 7%, rgb(0, 0, 0) 100%);
	background-position: bottom center;
	background-size: cover;
	background-repeat: no-repeat;
	background-attachment: fixed;
	font-family: sans-serif, system-ui;
}
h1{
  font-size: 32pt;
  font-family: "New Rocker", serif, system-ui;
  text-align: center;
}
p{
  max-width: 40rem;
}
.infocard{
  display:block;
  margin: 1em auto;
  border: 1pt solid white;
  background: #0000007f;
  width: fit-content;
  padding: 0.5em 1em;
}
.infocard img, .infobanner img{
	max-width: 75vw;
	max-height: 75vh;
	object-fit: contain;
}
.splash{
	width: 100vw;
	min-height: calc( 100vh - 15mm );
	align-content: space-around;
	justify-content: center;
	display:grid;
}
.splash h1{
  font-family: "Press Start 2P", sans-serif, system-ui;
  font-size: 20pt;
  margin: 2em;
}
.splash *{
	display: block;
	margin: auto auto;
	#position: relative;
}
.splash img{
	max-width: 75vw;
	max-height: 75vh;
}
.splash a{
	font-size: 24pt;
}
a{
	text-decoration: none;
	color: cyan;
}
  nav{
	background: linear-gradient(#dbc03f,#ffff73 20%,#dbc03f 45%,#be842d 55%,#874307) #b78a29;
	border: 2pt solid #874307;
	border-left-width: 0px;
	border-right-width: 0px;
    background-size: auto 100%;
    text-align: center;
    position: sticky;
    width: 100%;
    top: 0px;
    justify-content: space-between;
	overflow: auto;
  }
  nav button, nav .linkbutton{
	background: linear-gradient(180deg,rgba(117, 231, 255, 1) 0%, rgba(206, 250, 255, 1) 35%, rgba(166, 241, 255, 1) 40%, rgba(117, 231, 255, 1) 48%, rgba(87, 213, 255, 1) 51%, rgba(87, 213, 255, 1) 100%) #57d5ff;
	border: 1pt solid #47b9ff;
	border-radius: 0.5em;
	color: #cefaff;
    margin: calc(0.25 * 10mm) 10pt;
	text-shadow: 0pt 1pt 0px #37a5ff;
	font-weight: bold;
    padding: 0.5em 1em;
    display: inline-block;
  }
  nav img { max-height: 10mm; }

  nav .iconlink{
	float: right;
	border: 1pt solid #874307;
	border-radius: 0.25em;
  	max-height: 10mm;
	padding: 0.5em 1em;
	background: #874307;
  }
  nav .linkbutton img{
  	height: 1em;
  }
  .linkbutton{
	  display: block;
	  padding: 0.5em 1em;
	  margin: 1em;
	  border-radius: 1em;
	  text-align: center;
	  width: fit-content;
	  color: #9b5b13;
	  font-weight: bold;
      background: linear-gradient(#ebdb57, #c39b2f), #d7bb43;
      border: 1pt solid #9b5b13;
  }
  .linkbutton img{
  	height: 1em;
  }
  .linkbutton.discord{
  	background: linear-gradient(#5865f2, #19175c), #5865f2;
	border: 1pt solid #19175c;
  }
  .linkbutton.github{
  	background: linear-gradient(#3f3f3f, #171717), #2f2f2f;
	border: 1pt solid #070707;
	color: #dadada;
  }
  .linkbutton.wiki{
  	background: linear-gradient(#f6f6f6, #d1d1d1), #e4e4e4;
	border: 1pt solid #bfbfbf;
	color: #7f7f7f;
  }
  .flex{
	  display: flex;
	  justify-content: space-around;
	  align-content: center;
  }

@media (orientation: landscape){
  .flex-column{
	  display: flex;
	  justify-content: space-around;
	  align-items: center;
	  flex-direction: column;
  }
  .flex-row, :nth-child(odd of .infobanner){
	  display: flex;
	  justify-content: space-around;
	  align-items: center;
	  flex-direction: row;
  }
  .flex-column-reverse{
	  display: flex;
	  justify-content: space-around;
	  align-items: center;
	  flex-direction: column-reverse;
  }
  .flex-row-reverse, :nth-child(even of .infobanner){
	  display: flex;
	  justify-content: space-around;
	  align-items: center;
	  flex-direction: row-reverse;
  }
}
@media (orientation: portrait){
  .infobanner{
	  display: flex;
	  justify-content: space-around;
	  align-items: center;
	  flex-direction: column;
  }
  .flex-column, .flex-row{
	  display: flex;
	  justify-content: space-around;
	  align-items: center;
	  flex-direction: column;
  }
  .flex-column-reverse, .flex-row-reverse{
	  display: flex;
	  justify-content: space-around;
	  align-items: center;
	  flex-direction: column-reverse;
  }
}