/* More white space bottom than the CSS rule above
-------------------------------------------------------
body.exhibition-views .fr-caption,
body.category-exhibition-views .fr-caption {
	display: none !important;   dont't show caption or post title when in category "Exhibition views" 
}
*/

/* Less white space bottom than the CSS rule above
-------------------------------------------------------*/
body.exhibition-views .fr-info,
body.category-exhibition-views .fr-info {
	display: none !important;  /* dont't show caption or post title when in category "Exhibition views" */
}

.fresco_gallery {
	font-size: 0; /* hack to prevent white-space for each new line "\n" */
/** NEW FOR FLEX **/
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: horizontal;
	-webkit-box-direction: normal;
	    -ms-flex-flow: row wrap;
	        flex-flow: row wrap;
	-webkit-box-pack: start;
	    -ms-flex-pack: start;
	justify-content: flex-start;
	gap: 30px 5.6%;
	margin-bottom: 30px;
/** END NEW FOR FLEX **/
}

.fr-window {
	font: inherit;
	background-color: #fff;
}

/*
.fr-content,
.fr-content-background {
    max-width: 98%;
    margin: 0 1%;
}

.fr-ui-fullclick .fr-container {
  	bottom: 0 !important;
}
*/

.fr-ui-outside .fr-container,
.fr-ui-outside.fr-no-sides .fr-container,
.fr-ui-fullclick.fr-no-sides .fr-container {
  	padding: 12px 62px;
}

.fr-ui-fullclick.fr-type-video .fr-container {
  padding: 10px 60px;
}

.fresco_gallery a.thumbnail {
	position: relative;
	align-self: flex-start;
/** IS NOW FLEX
	margin: 0 4.2% 3.4% 0;
	display: inline-block;
	vertical-align: top;
**/
}

/*
.fresco_gallery a.thumbnail:nth-child(4n) {
    margin-right: 0;
}
*/

.fresco_gallery a.thumbnail img {
	width: 100%;
  	max-width: 200px;
}

/* <a> tag removed with jQuery for no-image.png and no-film.png */
.fresco_gallery > img {
	position: relative;
/** IS NOW FLEX
	width: 100%;
  	max-width: 200px;
	margin: 0 4.2% 20px 0;
	display: inline-block;
	vertical-align: top;
	line-height: 0;
**/
}


/* Thumbnail strip proportional
----------------------------------
.fr-thumbnail-image {
	left: 0 !important;
	max-width: 100% !important;
	max-height: 100% !important;
	height: auto !important;
	width: 100% !important;
}

.fr-thumbnail-wrapper {
	background-color: #fff;
}
---------------------------------*/

.entry-content .fresco_gallery a,
.entry-content .fresco_gallery a:hover,
.entry-content .fresco_gallery a:focus {
  	border-bottom: 0;
}

.entry-content .fresco_gallery a:not([href*='vimeo.com']):hover {
	opacity: 0.85;
}

.entry-content .fresco_gallery a:not([href*='vimeo.com']) {
	  		-webkit-transition: all 0.1s linear;
  		-moz-transition: all 0.1s linear;
  	-ms-transition: all 0.1s linear;
  -o-transition: all 0.1s linear;
  transition: all 0.1s linear;
}


.fr-side {
  margin-top: -60px !important;
}

.fr-side-button-background {
    background-color: transparent;
}

.fr-window-skin-fresco.fr-window-ui-outside .fr-close-background {
  	background-color: transparent;
}

.fr-window-skin-fresco.fr-window-ui-outside .fr-close:hover .fr-close-background {
  	background-color: transparent;
}

.fr-info-background,
.fr-ui-outside .fr-info-background {
  	background-color: #fff;
}

.fr-stroke {
	width: 0;
  	height: 0;
}

.fr-window-skin-fresco .fr-content-background {
  	background: #fff;
}

/*
.fr-position-background {
   	background-color: #fff;
}

.fr-page.fr-has-position.fr-has-caption.fr-ui-outside .fr-position {
	display: block;
}

.fr-position-outside .fr-position-text,
.fr-position-inside .fr-position-text {
    text-shadow: none;
}
*/
.fr-position,
.fr-position-outside {
	display: none !important;
}

/* Sprite */
.fr-window-skin-fresco .fr-side-button-icon,
.fr-window-skin-fresco .fr-close-icon,
.fr-window-skin-fresco .fr-thumbnails-side-button-icon,
.fr-window-skin-fresco .fr-error-icon {
  	/*background-image: url('../images/sprite-noshadow.svg'); small 'x' close icon */
  	background-image: url('../images/sprite-noshadow-bigX_NEW.svg');/* for a big 'X' close icon */
}
/* fallback png sprite */
.fr-window-skin-fresco.fr-no-svg .fr-side-button-icon,
.fr-window-skin-fresco.fr-no-svg .fr-close-icon,
.fr-window-skin-fresco.fr-no-svg .fr-thumbnails-side-button-icon,
.fr-window-skin-fresco .fr-error-icon {
  	/*background-image: url('../images/sprite-noshadow.png'); small 'x' close icon */
  	background-image: url('../images/sprite-noshadow-bigX_NEW.png');/* for a big 'X' close icon */
}

/**------------------------------------------ This is for a big 'X' close icon -----------------------------------------------------------**/
.fr-close {
	position: absolute;
	width: 54px;
	height: 54px;
	top: 5px;
	right: 0;
	cursor: pointer;
	-webkit-user-select: none;
	-moz-user-select: none;
	user-select: none;
}

.fr-close-background,
.fr-close-icon {
	  position: absolute;
	  top: 0;
	  left: 0;
	  height: 100%;
	  width: 100%;
	  background-position: 50% 50%;
	  background-repeat: no-repeat;
}

.fr-window-skin-fresco.fr-window-ui-inside .fr-close-background, 
.fr-window-skin-fresco.fr-window-ui-fullclick .fr-close-background {
  background-color: transparent;
}

.fr-window-skin-fresco.fr-window-ui-inside .fr-close:hover .fr-close-background, 
.fr-window-skin-fresco.fr-window-ui-fullclick .fr-close:hover .fr-close-background {
  background-color: transparent;
}

/* - image */
.fr-window-skin-fresco .fr-close .fr-close-icon { background-position: -141px -430px !important;}
.fr-window-skin-fresco .fr-close:hover .fr-close-icon { background-position: -203px -430px !important; }
/**---------------------------------------------- END ---------------------------------------------------------- for a big 'X' close icon **/



.fr-info {
	color: #777;
	font-size: 16px;
	text-align: center;
}

.fr-info-padder {
  	padding: 12px 10% 0;
}

.fr-thumbnails-disabled .fr-info-padder {
  	padding: 12px 10%;
}

.fr-window *,
.fresco,
.fresco * {
	box-shadow: none !important;
}

/* Play button overlay
---------------------------*/
/*
a.fresco[href*='vimeo.com'] {
    position: relative;
    display: inline-block;
}
*/

/*
a.fresco[href*='vimeo.com'] span.play {
    background: url('../images/play-72ppi.png') center center no-repeat;
    position: absolute;
    display: block;
    top: 50%;
    left: 50%;
    width: 80px;
    height: 80px;
    margin: -40px 0 0 -40px;
    z-index: 10;
    opacity: 0.8;
}
*/

a.fresco[href*='vimeo.com'] span.play {
  	background: url('../images/play-gray-outline.png') no-repeat center center;
	background-size: 50%;
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	opacity: 0.8;
}

a.fresco[href*='vimeo.com']:hover span.play {
	opacity: 1;
}


.fr-window.fr-mobile-touch {
	position: fixed;
	top: 0 !important;
}
 
.fr-overlay.fr-overlay-skin-fresco {
	position: absolute;
}

.fr-window-ui-fullclick .fr-thumbnails,
.fr-overlay-ui-fullclick .fr-overlay-background {
	background: #fff;
}

/*--------------------------------------------------------------
Media Queries
--------------------------------------------------------------*/

@media screen and (max-width: 550px) {
	
	.fresco_gallery a.thumbnail {
	/** IS NOW FLEX
		margin: 0 2.6% 2.6% 0;
	**/
	}
}


@media screen and (max-width: 497px) {
	
	.fresco_gallery a.thumbnail img {
		max-width: unset;
	}
	
	.fresco_gallery a.thumbnail {
		margin: 0 0 30px 0;
		display: block;
	}
	
}


@media all and (max-width: 500px) and (orientation: portrait),
       all and (orientation: landscape) and (max-height: 500px) {

	/* padding ui:outside */
	/*
	.fr-ui-outside .fr-container,
	.fr-ui-fullclick .fr-container {
		padding: 12px 62px;
	}
	*/
	
	/* padding ui:outside */
	.fr-ui-outside .fr-container,
	.fr-ui-fullclick .fr-container,
	.fr-ui-fullclick.fr-type-video .fr-container {
		padding: 0;
	}
}

@media screen and (max-width: 588px) {
	
	a.fresco[href*='vimeo.com'] span.play {
		background-size: 40%;
	}
}