/* ********************************* */
/*       Gallery Teaser Page         */
/* ********************************* */
.gallery-teaser-section .inner {display: flex; justify-content: flex-start; align-items: flex-start; flex-wrap: wrap;}
.gallery-teaser-section .gallerybox {display: inline-block; width: 32%; margin: 0 2% 2% 0;}
.gallery-teaser-section .gallerybox:nth-child(3n+3) {margin-right: 0;}
.gallery-teaser-section .gallerybox .imagewrapper {overflow:hidden; transition: all 0.3s;}
.gallery-teaser-section .gallerybox .imagewrapper img  {transition: all 0.3s; width: 100%; height: auto;}
.gallery-teaser-section .gallerybox:hover .imagewrapper img {transform: scale3d(1.1, 1.1, 1.0);}
.gallery-teaser-section .gallerybox .title {background: #445761; color: #ffffff; padding: 10px 20px; font-size: 1.2em; text-align: center; box-sizing: border-box; width: 100%; transition: all 0.3s;}
.gallery-teaser-section .gallerybox:hover .title {background-color: #42a2d6;}


/* ********************************* */
/*       Gallery Wrapper             */
/* ********************************* */
.gallery-wrapper {padding: 20px 0;background-color: #ffffff; background-attachment: fixed; background-size: cover;; background-position: center center; position: relative;}
.gallery-wrapper .overlay {position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
.gallery-wrapper .gallerybox {margin-bottom: 30px;}
.gallery-wrapper .gallerybox:nth-last-of-type(1) {margin-bottom: 0;}



/* ********************************* */
/*       Gallery Slider              */
/* ********************************* */
#gallery-slider {background: transparent; padding: 0 2%;}
#gallery-slider .inner {position: relative; }
#gallery-slider .gallery-slideshow {position: relative; margin: 0 auto; max-height: 75vh; width: auto;}
#gallery-slider .gallery-slideshow .slide-element {text-align: center;}
#gallery-slider .gallery-slideshow .slide-element img {vertical-align: top; max-height: 75vh; width: auto;}
#gallery-slider .cycle-next {width: 50px; height: 50px; position: absolute; top: 50%; right: 0vw; cursor: pointer; margin-top: -25px; display: flex; justify-content: space-around; align-items: center;}
#gallery-slider .cycle-prev {width: 50px; height: 50px; position: absolute; top: 50%; left: 0vw; cursor: pointer; margin-top: -25px; display: flex; justify-content: space-around; align-items: center;}

#gallery-slider .cycle-next:before {color: #e2e2e2; content: "\f345"; font-size: 115px; font-family: "dashicons"; display: inline-block; opacity: 1; position: relative; text-shadow: 2px 2px 4px rgba(0,0,0,.4); transition: all 0.3s;}
#gallery-slider .cycle-prev:before {color: #e2e2e2; content: "\f341"; font-size: 115px; font-family: "dashicons"; display: inline-block; opacity: 1; position: relative; text-shadow: 2px 2px 4px rgba(0,0,0,.4); transition: all 0.3s;}
#gallery-slider .cycle-next:hover:before {color: #42a2d6; }
#gallery-slider .cycle-prev:hover:before {color: #42a2d6; }


/* ********************************* */
/*       Gallery Squares             */
/* ********************************* */
#gallery-squares { padding: 0; }
#gallery-squares .inner {padding-bottom: 0;}
#gallery-squares .js-gallery {display: flex; justify-content: flex-start; align-items: flex-start; flex-wrap: wrap;}
#gallery-squares .js-gallery .element.image {display: inline-block; width: 16%; margin: 0 .8% .8% 0;position: relative; line-height: 0px;}
#gallery-squares .js-gallery .element.image:nth-child(6n+6) {margin-right: 0;} 
#gallery-squares .js-gallery .element.image .overlay {background: rgba(0,0,0,.75); position: absolute; top: 0; left: 0; width: 100%; height: 100%; line-height: 0; display: flex; justify-content: space-around; align-items: center; transition: all 0.5s; opacity: 0;}
#gallery-squares .js-gallery .element.image .overlay:hover {opacity: 1;}
#gallery-squares .js-gallery .element.image .overlay:before {color: #ffffff; content: "\f179"; font-family: "dashicons"; font-size: calc(16pt + 3vw); }


@media only screen and (max-width: 1000px) {
	.gallery-teaser-section .gallerybox:nth-child(3n+3) {margin-right: 2%;}
	.gallery-teaser-section .gallerybox {display: inline-block; width: 49%; margin: 0 2% 2% 0;}
	.gallery-teaser-section .gallerybox:nth-child(2n+2) {margin-right: 0;}

	#gallery-squares .js-gallery .element.image:nth-child(6n+6) {margin-right: 1.25%;} 
	#gallery-squares .js-gallery .element.image {width: 19%; margin: 0 1.25% 1.25% 0;}
	#gallery-squares .js-gallery .element.image:nth-child(5n+5) {margin-right: 0;} 
}

@media only screen and (max-width:800px) {
	#gallery-squares .js-gallery .element.image:nth-child(6n+6) {margin-right: 1.33%;} 
	#gallery-squares .js-gallery .element.image:nth-child(5n+5) {margin-right: 1.33%;} 
	#gallery-squares .js-gallery .element.image {width: 24%; margin: 0 1.33% 1.33% 0;}
	#gallery-squares .js-gallery .element.image:nth-child(4n+4) {margin-right: 0;} 

	#gallery-slider .cycle-next:before {font-size: 75px;}
	#gallery-slider .cycle-prev:before {font-size: 75px;}
}

@media only screen and (max-width: 600px) {
	.gallery-teaser-section .gallerybox:nth-child(1n+0) {display: inline-block; width: 100%; margin: 0 auto 20px; max-width: 450px; }

	#gallery-squares .js-gallery .element.image:nth-child(6n+6) {margin-right: 2%;} 
	#gallery-squares .js-gallery .element.image:nth-child(5n+5) {margin-right: 2%;} 
	#gallery-squares .js-gallery .element.image:nth-child(4n+4) {margin-right: 2%;} 
	#gallery-squares .js-gallery .element.image {width: 32%; margin: 0 2% 2% 0;}
	#gallery-squares .js-gallery .element.image:nth-child(3n+3) {margin-right: 0;} 
}

@media only screen and (max-width: 500px) {
	#gallery-slider  {padding: 0 0px; }
}

@media only screen and (max-width: 400px) {
	#gallery-squares .js-gallery .element.image:nth-child(6n+6) {margin-right: 2%;} 
	#gallery-squares .js-gallery .element.image:nth-child(5n+5) {margin-right: 2%;} 
	#gallery-squares .js-gallery .element.image:nth-child(4n+4) {margin-right: 2%;} 
	#gallery-squares .js-gallery .element.image:nth-child(3n+3) {margin-right: 2%;} 
	#gallery-squares .js-gallery .element.image {width: 49%; margin: 0 2% 2% 0;}
	#gallery-squares .js-gallery .element.image:nth-child(2n+2) {margin-right: 0;} 
}