body {
  overflow-x: scroll;
  overflow-y: scroll;
  position: absolute;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  margin: 10px;
  font-family: w95f;
  background-image: url(https://tomatohead.neocities.org/tb.png);
  background-repeat: repeat;
  background-position: right;
  }
  
.container {  
  display: grid;
  grid-template-columns: 192px 526px 286px;
  grid-template-rows: 128px 230px 410px 32px;
  gap: 10px 10px;
  grid-auto-flow: row;
  grid-template-areas:
    "tomato head head"
    "navigation main status"
    "navigation main log"
    "foot foot foot";
  border-style: solid;
  border-image-source: url(https://tomatohead.neocities.org/border.jpg);
  border-image-slice:53 38 57 38 fill;
  border-image-width:20px 20px 20px 20px;
  border-image-outset:20px 20px 20px 20px;
  border-image-repeat:stretch stretch;
  border-radius: 20px;
  margin-top: 10px;
  height: 820px;
  width: auto;
}

.head { 
  grid-area: head; 
}

.navigation { 
  grid-area: navigation;
  background: white;
}

.main { 
  grid-area: main;
  background: white;
}

.status { 
  grid-area: status;
  background-image: url(https://tomatohead.neocities.org/win98.png);
  background-size: cover;
  border-radius: 10px;
  text-align: center;
  overflow: scroll;
  height: 230px;
}

.log { 
  grid-area: log;
  background: white;
  margin-top: 50px;
}

.foot { 
  grid-area: foot;
  background: white;
}

.bigtomato {
  grid-area: tomato;
  position: absolute;

}

.bigtomato:hover {
  animation: spin 2s linear infinite;
}

.desktop {
  position: absolute;
}

@keyframes spin {
  from {transform: rotate(0deg)}
  to {transform: rotate(360deg)}
}

@font-face {
  font-family: w95f; /* set name */
  src: url(w95f.woff2); /* url of the font */
}