* {
    margin:0
}

body {
    margin:20px
}

h1{
  padding:20px 0px;
}

.grey:hover {
    background-color: #00000050;
}

.background {
  border:1px solid #000000;
  width:400px;
  outline-offset: 8px 8px 8px 8px ;
  outline: 8px outset #363636;
  box-shadow: 0px 0px 20px #000000;
}

.grid-container {
    display: grid;
    grid-template: 50px 50px 50px 50px 50px 50px 50px 50px/ auto auto auto auto auto auto auto auto;
  }  


.b {
    background-color: #363636;
  }

.w {
    background-color: #ffffff;
  }

  .p {
    display:block ;
    height: 44px;
    width: 44px;
    background-image: radial-gradient(#00000000,#00000000, #00000080) ;
    border: 3px double #7e7e7e;
    border-radius: 50%;
    box-shadow: 0px 2px 2px #000000;
  }

  .p:hover{
    box-shadow: 0px 0px 8px #f4d68a;
  }