.grid-item {
  width: 240px;
  margin-bottom: 10px;
  padding: 5px;
  box-sizing: border-box;
  height: 200px;
  animation: FadeIn 0.22s; }

.grid {
  margin: 0 auto;
  transition: 0.2s all; }

.grid-item--tall3 {
  height: 300px; }

.grid-item--tall4 {
  height: 400px; }

.grid-item--width2 {
  background-color: #81d4fa;
  width: 490px; }

.grid-item--image {
  width: fit-content;
  height: fit-content; }

@media (max-width: 575px) {
  .grid-item--width2 {
    width: 100%; } }
.blur-me {
  animation: FadeOut 0.22s;
  animation-fill-mode: both; }

@keyframes FadeOut {
  to {
    opacity: 0.8;
    filter: grayscale(20%) blur(0.7px) brightness(94%); } }
@keyframes FadeIn {
  to {
    opacity: 1;
    filter: grayscale(0%) blur(0px) brightness(100%); } }

/*# sourceMappingURL=masonry.css.map */