
  .nataraj {
    height: 100vh;
    height: 100svh;
    display: grid;
    place-items: center;
  }
  
  .nataraj .gallery {
    width: min(90vw,550px);
    list-style-type: none;
    display: grid;
    grid-template-columns: repeat(5,1fr);
    grid-auto-rows: 13vmin;
    gap: 0.25rem;
  
    & .item {
      background-size: cover;
      background-position: center;
  
      &:nth-of-type(1) { background-image: url('../assets/nataraj/1.png'); }
      &:nth-of-type(2) { background-image: url('../assets/nataraj/2.png'); }
      &:nth-of-type(3) { background-image: url('../assets/nataraj/3.png'); }
      &:nth-of-type(4) { background-image: url('../assets/nataraj/4.png'); }
      &:nth-of-type(5) { background-image: url('../assets/nataraj/5.png'); }
      &:nth-of-type(6) { background-image: url('../assets/nataraj/6.png'); }
  
      &:hover:not(li[data-pos="1"]) { cursor: pointer; }
    }
  }
  
  .nataraj li[data-pos='1'] {
    grid-column: 1/6;
    grid-row: 1/6;
  }
  
  .nataraj ::view-transition-group(*) { 
    animation-duration: 0.5s; 
    animation-timing-function: ease-in-out; 
  }