body{margin:0px;font-size:9px; color:#111; background-color:#FFF;}
table { 
  border-collapse: collapse; 
  width: 100%;
  height: 110px;
  display: table;
}
td { 
  text-align: center;
  vertical-align: middle;
  border: none;
}
.pixel { 
  width: 90px; 
  height: 90px; 
  background: linear-gradient(0deg, black 50%, #DDD 10%, white 100%);
  /* Adjusts gradient to have a sharp transition:
     - Starts with black at 0%,
     - Transitions to gray (#808080) starting at 40% and ending at 60%,
     - Ends with white at 100%.
  */
}

.col{
	width: 90%; 
	height: 80%;
	margin: auto;
  display: flex;
  justify-content: center;
  align-items: center;
  -webkit-text-stroke: 3px #fff;
  font-weight: bold; /* Bold text */
  /* White text border effect */
/*text-shadow:
-1px -1px 0 #fff,
1px -1px 0 #fff,
-1px  1px 0 #fff,
1px  1px 0 #fff;
	 */
}
.col{paint-order: stroke fill;color: #000; /* Black text */}
.col > * {
  text-align: center;
  
}