*{
    margin:0px;
    padding:0px;
}

  body{
         background-image: url('bg.jpg');
         min-height:100vh; 
         background-size:  100vw 100vh;  
         background-repeat:no-repeat ;  
         display:flex;
         justify-content: center;
         align-items: center;
    }

    #board{
      background: linear-gradient(rgb(121, 183, 121),rgb(192, 192, 117));
      width:90vmin;
      height:92vmin;
      border:2px solid black;
      display:grid;
      grid-template-rows: repeat(18,1fr);
      grid-template-columns: repeat(18,1fr);            

    }
    
    .head{
      background:linear-gradient(red,yellow);
      border:2px solid purple;
      border-radius:12px;
      transform:scale(1.1);
    }

    .snake{
      background-color: purple;
      border:2px solid white;
      border-radius:12px;  
    }
    
    .food{
        background: linear-gradient(rgb(76, 0, 255),purple);
          border:2px solid white;
      border-radius:6px;
    }

    #scorebox{
      position:absolute;
      top:50px;
      right:240px;
      font-size:40px;
      font-weight: bold;
    }

    #highScorebox{
      position:absolute;
      top:110px;
      right:160px;
      font-size:40px;
      font-weight: bold;
    }