* {
margin: 0;
box-sizing: border-box;}

@font-face {
  font-family: "Comic Sans";
  src: url("/comic-sans.woff") format("woff");
}

body {
  font-family: "Comic Sans MS", "Comic Sans", fantasy;
  display: flex;
  flex-direction: row;
  min-height: 100vh;
  color:white;
  background-color:black;
  font-size:17px;
}

.sidebar {
position: sticky;
top: 0;
height: 100vh;
width: 235px;
background-image:url('stars.webp');
display: flex;
flex-direction: column;
padding:10px;
align-items:center;
}

.big {
padding: 10px; 
}

.block {
background-image:url('stars.webp');
border: 3px solid transparent;
border-image: linear-gradient(to bottom right, #7b1cff 0%, #b827fc 20%, #f827fc 50%, #fcc81c 100%);
border-image-slice: 1;
padding: 20px;
margin: 20px;
box-shadow: 0 0 10px #f827fc;
width: 800px;
justify-content: center;
}

table, th, td {
  border: 1px solid;
  width:100%;
  margin:5px;
}

a {
  color:#f827fc;
  text-shadow: 0 0 10px #f827fc;
}

a:hover {
  color: #fcc81c;
  text-shadow: 0 0 10px #fcc81c;
}

h2 {
  font-size:30px;
  color:#fcc81c;
  text-shadow: 0 0 10px #fcc81c;
}

h3 {
  font-size:25px;
  color:#fcc81c;
  text-shadow: 0 0 10px #fcc81c;
}

.critter {
  float:left;
  border: 3px solid transparent;
  border-image: linear-gradient(to bottom right, #7b1cff 0%, #b827fc 20%, #f827fc 50%, #fcc81c 100%);
  border-image-slice: 1;
  box-shadow: 0 0 10px #f827fc;
  max-height:306px;
}

.bigcritter {
  display:flex;
  gap:8px;
}