* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  image-rendering: pixelated;
}

:root{
  --outline-white:
  drop-shadow(-1px 0 0 #e2e2e2)
  drop-shadow(1px 0 0 #e2e2e2)
  drop-shadow(0 -1px 0 #e2e2e2)
  drop-shadow(0 1px 0 #e2e2e2);
}

@font-face{
  font-family: 'lt_colored_pencil';
  src: url(/stylesheets/fonts/lt_colored_pencil-webfont.woff),
       url(/stylesheets/fonts/lt_colored_pencil-webfont.woff2);
  font-weight: normal;
  font-style: normal;
}

@keyframes fade-in{
  0% {opacity: 0;}
  100% {opacity: 1;}
}

::selection{
  color: #302622;
  background: transparent;
}

a{color: #ffffff; text-decoration: none;}
a:hover{font-style: italic;}

.wrapper{
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

body{
  background-image: url(https://i.postimg.cc/yxXGgHKC/lis2-bg2.png);
  background-size: cover;
  background-attachment: fixed;
  image-rendering: auto !important;
  font-family: 'lt_colored_pencil';
  color: #ffffff;
  animation: fade-in 0.4s ease-in;
}

.page{
  position: relative;
  width: fit-content;
  height: 300px;
}

#logo{
  filter: drop-shadow(0 0 3px rgb(0, 0, 0));
}

#wolves{
  position: absolute;
  bottom: 0;
  right: 0;
  filter: drop-shadow(0 0 3px rgb(0, 0, 0));
}

h1{
  position: relative;
  top: -40px;
  right: 40px;
  font-weight: normal;
  text-align: right;
  font-size: 33px;
  word-spacing: 15px;
  filter: drop-shadow(2px 2px 0 rgb(0, 0, 0, 0.8));
}