/**************************************/
/*                                    */
/*     photogallery                   */
/*                                    */
/**************************************/

img.gallery-open
{
cursor: pointer;
}

.maintext section.gallery
{
padding: 0px;
margin-top: var(--spacing);
margin-bottom: var(--spacing);
}

.maintext section.gallery .container
{
padding: 0px;
}

section.gallery .main
{
width: 100%;
padding-left: var(--spacing);
padding-right: var(--spacing);
font-size: var(--font-size-normal);
display: inline-block;
vertical-align: top;
}

.maintext section.gallery .main
{
padding-left: 0px;
padding-right: 0px;
}

section.gallery .main .images
{
display: flex;
flex-direction: row;
flex-wrap: wrap;
align-items: flex-start;
align-content: flex-start;
row-gap: var(--spacing);
column-gap: var(--spacing);
}

section.gallery .main .images > p
{
display: none;
}

section.gallery .main .images figure > br
{
display: none;
}

section.gallery .images figure
{
width: calc((100% - (var(--spacing)*3))/4);
margin: 0px;
}

section.gallery .main.size-small .images figure
{
width: calc((100% - (var(--spacing)*4))/5);
}

section.gallery .main.size-normal .images figure
{
width: calc((100% - (var(--spacing)*3))/4);
}

section.gallery .main.size-large .images figure
{
width: calc((100% - (var(--spacing)*2))/3);
}

section.gallery figure img
{
width: 100%;
margin: auto;
}

section.gallery .main.align-width figure img
{
width: 100%;
margin: auto;
}

/* section.gallery .main.align-height figure */
/* { */
/* overflow: hidden; */
/* } */

/* section.gallery .main.align-height figure img */
/* { */
/* width: auto; */
/* height: 200px; */
/* margin: auto; */
/* max-width: 9999px; */
/* } */

section.gallery .main.align-four-three figure
{
overflow: hidden;
}

section.gallery .main.align-four-three figure img
{
width: auto;
height: 200px;
margin: auto;
margin-left: 50%;
max-width: 9999px;
transform-origin: 50% 50%;
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
-o-transform: translateX(-50%);
transform: translateX(-50%);
}

section.gallery .main.size-small.align-four-three figure img
{
height: calc(((1140px - (var(--spacing)*4))/5) * 3/4);
}

section.gallery .main.size-medium.align-four-three figure img
{
height: calc(((1140px - (var(--spacing)*3))/4) * 3/4);
}

section.gallery .main.size-large.align-four-three figure img
{
height: calc(((1140px - (var(--spacing)*2))/3) * 3/4);
}

section.gallery .images figure figcaption
{
text-align: center;
font-size: var(--font-size-tags);
margin-top: 1em;
opacity: 0.75;
line-height: 1.3;
}

section.photogallery
{
background-color: rgba(0,0,0,1);
width: 100%;
height: 100vh;
position: fixed;
left: 0px;
opacity: 0;
top: -100vh;
z-index: 999;
-webkit-transition: all 0.5s;
transition: all 0.5s;
}

body.gallery-open section.photogallery
{
opacity: 1;
top: 0%;
}

section.photogallery .strip
{
position: absolute;
top: 15vh;
left: 5vw;
width: 90vw;
height: 70vh;
}

section.photogallery .img
{
position: absolute;
top: 0px;
width: 100%;
height: 100%;
background-size: contain;
background-repeat: no-repeat;
background-position: 50% 50%;
}

section.photogallery .img .caption
{
color: #ffffff;
font-size: var(--font-size-xsmall);
text-align: center;
position: fixed;
bottom: 0px;
left: 0px;
width: 100%;
}

section.photogallery .img .caption .captionbox
{
max-width: 700px;
margin: auto;
padding: calc(var(--spacing)*0.5);
padding-bottom: calc(var(--spacing)*1);
background-color: rgba(0,0,0,0.8);
}

section.photogallery .gallery-close
{
position: fixed;
top: calc(var(--spacing));
right: calc(var(--spacing));
}

section.photogallery .gallery-prev
{
position: fixed;
top: calc(50% - 14px);
left: calc(var(--spacing));
}

section.photogallery .gallery-next
{
position: fixed;
top: calc(50% - 14px);
right: calc(var(--spacing));
}

section.photogallery .controls
{
position: absolute;
bottom: 0px;
left: 0px;
width: 100%;
display: none;
}

body.gallery-open section.photogallery .controls
{
display: block;
}

section.photogallery .controls button
{
background-color: transparent;
color: #ffffff;
width: 85px;
height: 28px;
font-size: 0px;
}

section.photogallery .controls button::before
{
content:"";
display: inline-block;
position: absolute;
top: 0px;
left: 0px;
width: 100%;
height: 100%;
background-position: 0% 50%;
background-size: contain;
background-repeat: no-repeat;
-webkit-transition: all 0.3s;
transition: all 0.3s;
}

section.photogallery .controls button:hover::before
{
background-position: 80% 50%;
}
section.photogallery .controls button:active::before
{
background-position: 100% 50%;
}

section.photogallery .controls button.gallery-close
{
width: 30px;
height: 30px;
background-color: var(--bgcolor-accent);
}

section.photogallery .controls button.gallery-prev
{
-webkit-transform: scale(-1,1);
-ms-transform: scale(-1,1);
-o-transform: scale(-1,1);
transform: scale(-1,1);
}

section.photogallery .controls button.gallery-close::before
{
background-position: 50% 50%;
-webkit-transform: scale(0.8);
-ms-transform: scale(0.8);
-o-transform: scale(0.8);
transform: scale(0.8);
}

section.photogallery .controls button.gallery-close:hover::before
{
-webkit-transform: scale(1);
-ms-transform: scale(1);
-o-transform: scale(1);
transform: scale(1);
}

section.photogallery .controls button.gallery-close::before
{
background-image:url('../img/menu-close-white.png');
}

section.photogallery .controls button.gallery-prev::before
{
background-image:url('../img/arrow-white.svg');
}

section.photogallery .controls button.gallery-next::before
{
background-image:url('../img/arrow-white.svg');
}

section.photogallery .controls .index
{
width: 100%;
text-align: center;
color: #ffffff;
position: fixed;
top: 50px;
left: 0px;
font-size: var(--font-size-small);
font-weight: var(--font-weight-bold);
}


/*-- 1300-full start --*/
@media screen and (min-width: 1301px)
{
	.maintext section.gallery .main.size-small.align-four-three figure img
	{
	height: calc(((711px - (var(--spacing)*4))/5) * 3/4);
	}

	.maintext section.gallery .main.size-medium.align-four-three figure img
	{
	height: calc(((711px - (var(--spacing)*3))/4) * 3/4);
	}

	.maintext section.gallery .main.size-large.align-four-three figure img
	{
	height: calc(((711px - (var(--spacing)*2))/3) * 3/4);
	}
}

/*-- 1001-1300 start --*/
@media screen and (max-width: 1300px)
{
	section.gallery .main.size-small.align-four-three figure img
	{
	height: calc((((100vw - (var(--spacing)*4)) - (var(--spacing)*4))/5) * 3/4);
	}

	section.gallery .main.size-medium.align-four-three figure img
	{
	height: calc((((100vw - (var(--spacing)*4)) - (var(--spacing)*3))/4) * 3/4);
	}

	section.gallery .main.size-large.align-four-three figure img
	{
	height: calc((((100vw - (var(--spacing)*4)) - (var(--spacing)*2))/3) * 3/4);
	}

	.maintext section.gallery .main.size-small.align-four-three figure img
	{
	height: calc((((65vw - (var(--spacing)*4)) - (var(--spacing)*4))/5) * 3/4);
	}

	.maintext section.gallery .main.size-medium.align-four-three figure img
	{
	height: calc((((65vw - (var(--spacing)*4)) - (var(--spacing)*3))/4) * 3/4);
	}

	.maintext section.gallery .main.size-large.align-four-three figure img
	{
	height: calc((((65vw - (var(--spacing)*4)) - (var(--spacing)*2))/3) * 3/4);
	}
}

/*-- 768-1000 start --*/
@media screen and (max-width: 1000px)
{
	section.gallery .images figure
	{
	width: calc((100% - (var(--spacing)*2))/3);
	}

	section.gallery .main.size-small .images figure
	{
	width: calc((100% - (var(--spacing)*3))/4);
	}

	section.gallery .main.size-normal .images figure
	{
	width: calc((100% - (var(--spacing)*2))/3);
	}

	section.gallery .main.size-large .images figure
	{
	width: calc((100% - (var(--spacing)*1))/2);
	}

	section.gallery .main.size-small.align-four-three figure img
	{
	height: calc((((100vw - (var(--spacing)*4)) - (var(--spacing)*3))/4) * 3/4);
	}

	section.gallery .main.size-medium.align-four-three figure img
	{
	height: calc((((100vw - (var(--spacing)*4)) - (var(--spacing)*2))/3) * 3/4);
	}

	section.gallery .main.size-large.align-four-three figure img
	{
	height: calc((((100vw - (var(--spacing)*4)) - (var(--spacing)*1))/2) * 3/4);
	}

	.maintext section.gallery .main.size-small.align-four-three figure img
	{
	height: calc((((65vw - (var(--spacing)*4)) - (var(--spacing)*3))/4) * 3/4);
	}

	.maintext section.gallery .main.size-medium.align-four-three figure img
	{
	height: calc((((65vw - (var(--spacing)*4)) - (var(--spacing)*2))/3) * 3/4);
	}

	.maintext section.gallery .main.size-large.align-four-three figure img
	{
	height: calc((((65vw - (var(--spacing)*4)) - (var(--spacing)*1))/2) * 3/4);
	}

}

/*-- 651-767 start --*/
@media screen and (max-width: 767px)
{
	section.gallery .images figure
	{
	width: calc((100% - (var(--spacing)*1))/2);
	}	

	section.gallery .main.size-small .images figure
	{
	width: calc((100% - (var(--spacing)*2))/3);
	}

	section.gallery .main.size-normal .images figure
	{
	width: calc((100% - (var(--spacing)*1))/2);
	}

	section.gallery .main.size-large .images figure
	{
	width: 100%;
	}

	section.gallery .main.size-small.align-four-three figure img
	{
	height: calc((((100vw - (var(--spacing)*4)) - (var(--spacing)*2))/3) * 3/4);
	}

	section.gallery .main.size-medium.align-four-three figure img
	{
	height: calc((((100vw - (var(--spacing)*4)) - (var(--spacing)*1))/2) * 3/4);
	}

	section.gallery .main.size-large.align-four-three figure img
	{
	height: calc((((100vw - (var(--spacing)*4)) - (var(--spacing)*0))/1) * 3/4);
	}

	.maintext section.gallery .main.size-small.align-four-three figure img
	{
	height: calc((((100vw - (var(--spacing)*4)) - (var(--spacing)*2))/3) * 3/4);
	}

	.maintext section.gallery .main.size-medium.align-four-three figure img
	{
	height: calc((((100vw - (var(--spacing)*4)) - (var(--spacing)*1))/2) * 3/4);
	}

	.maintext section.gallery .main.size-large.align-four-three figure img
	{
	height: calc((((100vw - (var(--spacing)*4)) - (var(--spacing)*0))/1) * 3/4);
	}

	section.photogallery .img .caption
	{
	padding-bottom: calc(var(--spacing)*2);
	padding-bottom: 80px;
	}
}

/*-- 0-650 start --*/
@media screen and (max-width: 650px)
{

}