.dnetor-gallery-metro .image {
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  padding-top: var(--dnetor-gallery-ratio);
}
.dnetor-gallery-metro .dnetor-gallery-item {
  display: grid;
}
.dnetor-gallery-metro::after {
  content: "";
  display: block;
}
.dnetor-gr-2 {
  grid-row: span 2;
}
.dnetor-gr-3 {
  grid-row: span 3;
}
.dnetor-gr-4 {
  grid-row: span 4;
}
.dnetor-gr-5 {
  grid-row: span 5;
}
.dnetor-gr-6 {
  grid-row: span 6;
}
.dnetor-gr-7 {
  grid-row: span 7;
}
.dnetor-gr-8 {
  grid-row: span 8;
}
.dnetor-gr-9 {
  grid-row: span 9;
}
.dnetor-gr-10 {
  grid-row: span 10;
}
.dnetor-gr-11 {
  grid-row: span 11;
}
.dnetor-gr-12 {
  grid-row: span 12;
}
.dnetor-gc-2 {
  grid-column: span 2;
}
.dnetor-gc-3 {
  grid-column: span 3;
}
.dnetor-gc-4 {
  grid-column: span 4;
}
.dnetor-gc-5 {
  grid-column: span 5;
}
.dnetor-gc-6 {
  grid-column: span 6;
}
.dnetor-gc-7 {
  grid-column: span 7;
}
.dnetor-gc-8 {
  grid-column: span 8;
}
.dnetor-gc-9 {
  grid-column: span 9;
}
.dnetor-gc-10 {
  grid-column: span 10;
}
.dnetor-gc-11 {
  grid-column: span 11;
}
.dnetor-gc-12 {
  grid-column: span 12;
}
@media screen and (max-width: 1024px) {
  .dnetor-gallery-metro .dnetor-image {
    padding-top: var(--dnetor-gallery-ratio-md);
  }
  .dnetor-gr-md-1 {
    grid-row: span 1;
  }
  .dnetor-gr-md-2 {
    grid-row: span 2;
  }
  .dnetor-gr-md-3 {
    grid-row: span 3;
  }
  .dnetor-gr-md-4 {
    grid-row: span 4;
  }
  .dnetor-gr-md-5 {
    grid-row: span 5;
  }
  .dnetor-gr-md-6 {
    grid-row: span 6;
  }
  .dnetor-gr-md-7 {
    grid-row: span 7;
  }
  .dnetor-gr-md-8 {
    grid-row: span 8;
  }
  .dnetor-gr-md-9 {
    grid-row: span 9;
  }
  .dnetor-gr-md-10 {
    grid-row: span 10;
  }
  .dnetor-gr-md-11 {
    grid-row: span 11;
  }
  .dnetor-gr-md-12 {
    grid-row: span 12;
  }
  .dnetor-gc-md-1 {
    grid-column: span 1;
  }
  .dnetor-gc-md-2 {
    grid-column: span 2;
  }
  .dnetor-gc-md-3 {
    grid-column: span 3;
  }
  .dnetor-gc-md-4 {
    grid-column: span 4;
  }
  .dnetor-gc-md-5 {
    grid-column: span 5;
  }
  .dnetor-gc-md-6 {
    grid-column: span 6;
  }
  .dnetor-gc-md-7 {
    grid-column: span 7;
  }
  .dnetor-gc-md-8 {
    grid-column: span 8;
  }
  .dnetor-gc-md-9 {
    grid-column: span 9;
  }
  .dnetor-gc-md-10 {
    grid-column: span 10;
  }
  .dnetor-gc-md-11 {
    grid-column: span 11;
  }
  .dnetor-gc-md-12 {
    grid-column: span 12;
  }
}
@media screen and (max-width: 767px) {
  .dnetor-gallery-metro .dnetor-image {
    padding-top: var(--dnetor-gallery-ratio-sm);
  }
  .dnetor-gr-sm-1 {
    grid-row: span 1;
  }
  .dnetor-gr-sm-2 {
    grid-row: span 2;
  }
  .dnetor-gr-sm-3 {
    grid-row: span 3;
  }
  .dnetor-gr-sm-4 {
    grid-row: span 4;
  }
  .dnetor-gr-sm-5 {
    grid-row: span 5;
  }
  .dnetor-gr-sm-6 {
    grid-row: span 6;
  }
  .dnetor-gr-sm-7 {
    grid-row: span 7;
  }
  .dnetor-gr-sm-8 {
    grid-row: span 8;
  }
  .dnetor-gr-sm-9 {
    grid-row: span 9;
  }
  .dnetor-gr-sm-10 {
    grid-row: span 10;
  }
  .dnetor-gr-sm-11 {
    grid-row: span 11;
  }
  .dnetor-gr-sm-12 {
    grid-row: span 12;
  }
  .dnetor-gc-sm-1 {
    grid-column: span 1;
  }
  .dnetor-gc-sm-2 {
    grid-column: span 2;
  }
  .dnetor-gc-sm-3 {
    grid-column: span 3;
  }
  .dnetor-gc-sm-4 {
    grid-column: span 4;
  }
  .dnetor-gc-sm-5 {
    grid-column: span 5;
  }
  .dnetor-gc-sm-6 {
    grid-column: span 6;
  }
  .dnetor-gc-sm-7 {
    grid-column: span 7;
  }
  .dnetor-gc-sm-8 {
    grid-column: span 8;
  }
  .dnetor-gc-sm-9 {
    grid-column: span 9;
  }
  .dnetor-gc-sm-10 {
    grid-column: span 10;
  }
  .dnetor-gc-sm-11 {
    grid-column: span 11;
  }
  .dnetor-gc-sm-12 {
    grid-column: span 12;
  }
}