/**
 * Frontend CSS for Nobel Gallery
 */

/* line 11, ../sass/css/_templates.scss */
.the-gallery {
  *zoom: 1;
}
/* line 14, ../sass/css/_templates.scss */
/* .the-gallery:before, .the-gallery:after {
  content: "\0020";
  display: block;
  height: 0;
  overflow: hidden;
} */
/* line 21, ../sass/css/_templates.scss */
/* .the-gallery:after {
  clear: both;
} */

/* line 11, ../sass/css/_templates.scss */
/* .the-gallery {
  *zoom: 1;
} */
/* line 14, ../sass/css/_templates.scss */
/* .the-gallery:before, .the-gallery:after {
  content: "\0020";
  display: block;
  height: 0;
  overflow: hidden;
} */
/* line 21, ../sass/css/_templates.scss */
/* .the-gallery:after {
  clear: both;
} */

/* line 10, ../sass/css/nobel-gallery.scss */
/* .the-gallery.in-collection {
  display: none;
} */
/* line 14, ../sass/css/nobel-gallery.scss */
/* .the-gallery .gallery {
  float: left;
  clear: none;
  margin: 0 5px;
} */

#content .gallery img {
    border: 0;
    margin: 0;
    padding: 0;
}

.nobel-gallery .gallery-title,
.entry-content .gallery-title {
    font-size: 1.6rem;
    color: var(--blue);
    border-bottom: 2px solid var(--blue);
    /* padding: .5rem 0; */
    margin-bottom: 15px;
}

.the-gallery ul {
    display: grid;
    grid-template-columns: repeat(2, auto);
    grid-gap: 1rem;
    margin-left: 0;
    justify-content: flex-start;
    align-items: flex-start;
}

.the-gallery ul li.gallery img {
    max-height: 100%;
    /* width: auto; */
}
.the-gallery ul li.gallery {
    text-align: center;
    padding: 0;
    margin: 0;
}
.the-gallery ul li h3 {
    font-size: 1rem;
}

.back-to-gallery {
    display: inline-block;
    font-size: 1.2rem;
    margin: 2rem auto 0;
    padding: 6px 0;
    color: var(--blue);
}

/* Overwrite pretty photo title */
div.ppt {
    display: none !important;
}


@media only screen and ( min-width: 768px ) {
    
    .the-gallery ul {
        grid-template-columns: repeat(3, auto);
    }
    .the-gallery ul li h3 {
        font-size: 1.2rem;
    }
}

@media only screen and ( min-width: 1024px ) {
    
    .the-gallery ul {
        grid-template-columns: repeat(4, auto);
    }
    
    .nobel-gallery .gallery-title,
    .entry-content .gallery-title {
        font-size: 1.8rem;
    }
    
}
@media only screen and ( min-width: 1440px ) {
    
    .the-gallery ul {
        grid-template-columns: repeat(5, auto);
    }    
}
