.pictures {
  background-color: #000;
  height: fit-content;
  background-attachment: fixed;
  background-position: center;
  background-size: cover;
  padding: 0;
}

.picblurrer {
  height: 100%;
  margin: 0;
  width: 100%;
  min-height: 100%;
  backdrop-filter: blur(2px) brightness(50%);
  padding: 6vh 0;
  text-align: center;
}

.picblurrer p {
  background-color: #fff;
  width: fit-content;
  padding: 5px 20px;
  text-align: center;
  margin: 0 auto;
}

.picwrap {
  padding: 4em;
  height: fit-content;
  min-height: 100%;
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  align-items: center;
  flex-wrap: wrap;
}

.pic {
  max-width: 32vw;
  transition: all 0.125s;
}

.pic * { width: 100%; border-radius: 10%; }
.pic:hover { transform: scale(1.1); }

.leftimganimation { animation: in-from-left 1s; }
.rightimganimation { animation: in-from-right 1s; }


@keyframes in-from-left {
  0% { transform:translate(-200%); opacity: 0; }
  100% { transform: translate(0,0); opacity: 1; }
}


@keyframes in-from-right {
  0% { transform:translate(200%); opacity: 0; }
  100% { transform: translate(0,0); opacity: 1; }
}

@media screen and (max-width: 640px) {
  .pictures,.picblurrer,.picwrap { height: fit-content; }
  .picwrap { padding: 5px; }
  .pic {
    max-width: 75vw;
    margin: 15px;
  }
}