@charset "utf-8";
/* CSS Galeria */
.albumFotos {
    background-color: var(--theme-color-neutro);
    padding-bottom: 5em;
}
/* Con PhotoSwipe */
      .pswp-gallery {
        max-width: 1750px;
          padding: 20px;
        margin: 0 auto;
        /* padding: 0 50px 50px; */
/*        background: #eee;*/
        position: relative;
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(min(250px, 100%), 1fr));
        grid-auto-rows: 250px;
        grid-auto-flow: dense;
        grid-gap: 20px;
        /* flex-wrap: wrap;
        justify-content: center;
        gap: 1em;
        flex-grow: 0;
        flex-shrink: 0;
        flex-basis: 200px; */
      }
      .pswp-gallery__item:nth-child(3n-2) {
        grid-column: span 2;
        grid-row: span 2;
      }
      .pswp-gallery__item img {
        display: block;
        width: 100%;
        height: 100%;

        object-fit: cover;
          border: solid 1px var(--dorado);
      }
      .pswp__dynamic-caption {
        color: #fff;
        width: 100%;
      }
      .pswp__dynamic-caption a {
        color: #fff;
        text-decoration: underline;
      }
/* Fin con PhotoSwipe */




.grid-galeria {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 50px 20px;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(250px, 100%) 1fr));
  grid-auto-rows: 250px;
  grid-auto-flow: dense;
  grid-gap: 20px;
}
.grid-galeria .grid-articulo:nth-child(3n - 2) {
  grid-column: span 2;
  grid-row: span 2;
}
.grid-galeria .grid-articulo {
  position: relative;
  background-color: var(--theme-color-neutro);
  overflow: hidden;
  border: 1px solid var(--dorado);
}

.grid-galeria .grid-articulo img {
  width: 100%;
  height: 100%;
/*
  filter:grayscale(.7)
  contrast(1.1);
*/

  object-fit: cover;
transition: transform .8s;
/*  transition: all 0.7s cubic-bezier(0.165, 0.84, 0.44, 1);*/
  /* transition: filter 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); */
}

.grid-galeria .grid-articulo:hover img {
/*
  filter:grayscale(0)
  contrast(1);
*/
  transform: scale(1.1);
}

.grid-articulo figcaption{
    background-color: var(--theme-color-neutro);
    color: var(--text-color-inverse);
}

/*
.grid-gallery .grid-item a {
  cursor: zoom-in;
}
*/



/*
.galeria img {
    transition: transform .8s;
}
*/

/*
.galeria a:hover img {
        filter: blur(1px);
    transform: scale(1.3);
}
*/
.light-box {
    position: fixed;
    top: 0px;
    left: 0px;
    padding: .5em;
    background-color: rgba(0,2,51,.9);
    color: var(--text-color-inverse);
    /* anteriormente en %
    width: 100%; */
    width: 100vw;
    height: 100vh;
    z-index: 20;
    display: flex;
    justify-content: center;
    align-items: center;
    
    transition: transform .3s easy;
    transform: scale(0);
}
.light-box img {
    object-fit:contain;
    width: 95vw;
    max-height: 95vh;
}
.light-box:target {
    transform: scale(1);
}
.cerrar {
    display: block;
    position: absolute;
    top: 40px;
    right: 40px;
/*    background-color: var(--primary-color-oscuro);*/
    color: var(--text-color-inverse);
    width: 30px;
    height: 30px;
    text-align: center;
    line-height: 30px;
    text-decoration: none;
/*    border-radius: 50%;*/
}
.siguiente {
    display: block;
/*    background-color: var(--primary-color-oscuro);*/
    color: var(--text-color-inverse);
    width: 5vmin;
    height: 5vmin;
    line-height: 5vmin;
    text-align: center;
    text-decoration: none;
}

.cerrar,
.siguiente {
    font-size: 2.3rem;
    font-weight: bolder;
}                     

/*
    .galeria {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(130px, auto));
        width: 95%;
        margin: auto;
        grid-gap: 3vmin;
        padding: 40px 0;
        overflow: hidden;
    }
    .galeria img {
        width: 100%;
        vertical-align: top;
        height: 200px;
        object-fit: cover;
        transition: transform .5s;
    }
    .galeria > a {
        display: block;
        position: relative;
        overflow: hidden;
        box-shadow: 0 0 6px rgba(0, 0, 0, .5);
    }
*/
/*
.galeria {
        aspect-ratio: 2/2;
}
*/