html, body {
  border: 0;
  margin: 0;
  /*width: 100%;*/
  height: 100%;
}
body { background-color:#f7f7f7;}
#container {
    margin: 6px 0px 0px 163px;
    width: 920px;
    height: 920px;
    overflow: visible;
}

#gridacord-container {
  display: flex;
  width: 100%;
  height: 100%;
  margin: 0 auto;
  flex-direction: column;
  overflow: visible;
}

#container .line {
  display: flex;
  width: 100%;
  overflow: visible;
  outline: 5px solid #fafafa;
  z-index: 5;
}

#container .line .item {
  height: 100%;
  overflow: hidden;
  outline: 5px solid #fafafa;
  z-index: 5;
}

#container .item img {
  position: relative;
  transition: filter 1s ease-in-out;
  -webkit-transition: -webkit-filter 1s ease-in-out;
  -webkit-filter: grayscale(100%);
  filter: grayscale(100%);
}

#container .item:hover > img {
  transition: filter 1s ease-in-out;
  -webkit-transition: -webkit-filter 1s ease-in-out;
  -webkit-filter: grayscale(0%);
  filter: grayscale(0%);
}