*,
*::before,
::after {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

.grid img {
  display: block;
}

.grid {
  display: inline-block;
  position: relative;
  margin: 10px;
  vertical-align: top;
}

.grid:hover:before,
.grid:hover:after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(to right, rgba(0,0,0,0.1) 2px, transparent 2px);
  background-size: 8.333%;
}

.grid:hover:before {
  box-shadow: inset 0px 0px 0 1px rgba(0,0,0,0.1);
}

.grid:hover:after {
  transform: rotate(90deg);
}

.fixed:hover:before,
.fixed:hover:after {
  background-size: 50px;
}