.grid-container {
  display: grid;
}

.grid-container>div {
  background-color: #181818;
  border: solid thin black;
  border-radius: 9px;
  float: left;
  vertical-align: middle;
  box-align: center;
}

div.gallery img {
  position: relative;
  width: 100%;
  object-fit: cover;
  object-position: top;
  height: auto;
  border-top-left-radius: 9px;
  border-top-right-radius: 9px;
}

#download-box {
  color: black;
  border: thin solid black;
  background-color: #9E9E9E;
  padding: 3.5px;
  border-radius: 5px;
}

/*-----------------------------
        Desktop
-----------------------------*/
@media only screen and (min-width : 790px) {
  .grid-container {
    grid-template-columns: 33.333% 33.333% 33.333%;
  }

  .grid-container>div {
    margin: 8px;
  }

  .desc {
    padding: 7px;
  }

  #download-box:hover {
    background-color: black;
    color: #9E9E9E;
    border: thin solid #9E9E9E;
  }
}

/*-----------------------------
        Mobile
-----------------------------*/
@media only screen and (max-width : 789px) {
  .grid-container {
    grid-template-columns: auto;
  }

  .grid-container>div {
    margin-top: 10px;
  }

  .upmark {
    font-size: 16px;
  }
}