.projectwrapper{
  object-fit: cover;
  margin: auto;
  display: grid;
  grid-template-columns: auto;
  grid-template-rows: auto auto;
  justify-items: center;
}

img.projectheaderimg{
  object-fit: contain;
  margin: auto;
  box-shadow: var(--genshadow);
  display: grid;
  justify-content: center;
}

.projectheader{
  text-align: center;
}

.projectcaption{
  margin: var(--genmargin) 0;
  padding: var(--genmargin);
}

.projectimg{
  width: 100%;
  height: 360px;
  object-fit: cover;
  scroll-snap-align: center;
  scroll-snap-stop: always;
}


@media screen and (min-width: 1000px) {

.projectwrapper{
  justify-items: center;
}

img.projectheaderimg{
  height: 240px;
  width: 100%;
  object-fit: cover;
}

img.projectimg{
  transition: 150ms;
  object-fit: cover;
  width: 1fr;
  height: 1fr;
  box-shadow: var(--genshadow);
}