.myndir{
    display: grid;
    grid-template-columns: 1fr;
    text-align: center;
    
}

@media screen and (min-width:48em) {
    .myndir {
        grid-template-columns: 1fr 1fr;
        gap: 2em;
        row-gap: 2em;
        
    }
  }

  @media screen and (min-width:80em) {
    .myndir{
        grid-template-columns: 1fr 1fr 1fr;
        gap:2em;
        row-gap: 2em;
    }
  }

  img { 
    max-width:100%;
    height: auto;
    border: solid black;
}


figcaption{
    text-align: center;
   
}


.catlogo{
    border:0;
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: 50%;
}

.zoom-in-out-box {
    animation: zoom-out 2s;
    animation-delay: 2s;
    visibility:hidden;
    animation-fill-mode: forwards;
  }
  
  @keyframes zoom-out {
      0% {
          visibility:hidden;
        transform: scale(0, 0);
      }
  
      100% {
        transform: scale(1, 1);
        visibility: visible;
      }
  }