@font-face {
  font-family: PixelOperatorBold;
  src: url(PixelOperatorBold.ttf);
}

@font-face {
  font-family: Nulshock;
  src: url(Nulshock.otf);
}

@font-face {
  font-family: MSGOTHIC;
  src: url(MSGOTHIC.TTF);
}

@font-face {
  font-family: PixelNES;
  src: url(PixelNES.otf);
}

body {
  background-image: linear-gradient(#fff5, #fff5),
                    url('background.gif');
  overflow-x: hidden;
  font-family: Arial;
}

a.menu {
  font-family: Nulshock;
  font-size: 11px; 
  color: white;
  text-decoration: none;
  padding: 2px;
}

a.menu:hover {
  font-family: Nulshock;
  font-size: 11px; 
  color: white;
  text-decoration: none;
  background: url("L4.gif");
  padding: 2px;
}

.container {
  background: white;
  display: grid;
  grid-template-columns: 225px 175px 300px;
  grid-template-rows: auto;
  grid-template-areas: 
    "left middle right";
  column-gap: 10px;
  row-gap: 10px;
  height: 530px;
  width: 638px;
  margin: 20px auto auto auto;
  padding: 15px; 
  border: 1px dashed black;
  box-shadow: 0 0 15px 1px hotpink;
}

.left {
  grid-area: left;
}

.middle {
  grid-area: middle;
}

.right {
  grid-area: right;
}

.thumbnail:hover {
  transform: scale(1.10);
}

.mikusprite {
   background-image: url('mikuleek2.png');
   background-repeat: no-repeat;
   height: 356px;
   width: 175px;
   position: absolute;
   margin-top: 330px;
   margin-left: 635px;
}

.mikusprite:hover {
   background-image: url('mikuleek1.png');
   background-repeat: no-repeat;
}