/*
Theme Name: Groepper
Theme URI: https://uria.cc
Author: URIA Advertising | Andreas Fischer
Author URI: http://tidythemes.com/
Description: custom Theme
Version: 2020.07
License: GNU General Public License
License URI: https://www.gnu.org/licenses/gpl.html
Text Domain: groepper

based on:
BlankSlate WordPress Theme © 2011-2019 TidyThemes
BlankSlate is distributed under the terms of the GNU GPL
*/

html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}body{line-height:1}button{outline:0}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}q{display:inline;font-style:italic}q:before{content:'"';font-style:normal}q:after{content:'"';font-style:normal}textarea,input[type="text"],input[type="button"],input[type="submit"],input[type="reset"],input[type="search"],input[type="password"]{-webkit-appearance:none;appearance:none;border-radius:0}table{border-collapse:collapse;border-spacing:0}th,td{padding:2px}big{font-size:120%}small,sup,sub{font-size:80%}sup{vertical-align:super}sub{vertical-align:sub}dd{margin-left:20px}kbd,tt{font-family:courier;font-size:12px}ins{text-decoration:underline}del,strike,s{text-decoration:line-through}dt{font-weight:bold}address,cite,var{font-style:italic}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
.sticky{}.bypostauthor{}.wp-caption{}.wp-caption-text{}.gallery-caption{}.alignright{}.alignleft{}.aligncenter{}.screen-reader-text{clip:rect(1px, 1px, 1px, 1px);position:absolute !important}


/* Basics */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	vertical-align: baseline;
	}
html,body
	{
	height:100%;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
			box-sizing: border-box;
	}
*, *:before, *:after 
	{
	-webkit-box-sizing: inherit;
	   -moz-box-sizing: inherit;
			box-sizing: inherit;
	}

html
	{
	padding:0; margin:0;
	}
@media screen and (max-width:800px) 
	{
	html.menuopen
		{
		overflow: hidden;
		}
	}
body
	{
	font-family:'Helvetica', 'Neue Helvetica W05';
	padding:0; margin:0;
	overflow-x: hidden;
	overflow-y: auto;
	background-color: white;
	font-size: 16px;
	line-height:22px;
	font-weight: 300;
	scroll-behavior: smooth;
	-webkit-overflow-scrolling: touch;
	}
@media screen and (max-width:800px) 
	{
	.menuopen body
		{
		/*overflow-y: hidden;*/
		}
	}
h2
	{
	font-weight:500;
	margin-bottom: 10px;
	}
strong, b
	{
	font-weight:500;
	}
.clear
	{
	clear:both;
	}
.hidden
	{
	display: none;
	}

.wp-block-embed__wrapper
	{
	width: 100%;
	position: relative;
	padding-top: 56.25%;
	}
.wp-block-embed__wrapper iframe
	{
	position: absolute;
	top:0; right:0; bottom:0; left:0; 
	width:100%; height:100%;
	}
	
/* HEADER */
#header
	{
	z-index: 10;
	padding-left:40px;
	position: fixed;
	top:50%;
	-webkit-transform: translate(0,-50%);
	   -moz-transform: translate(0,-50%);
			transform: translate(0,-50%);
	}
@media screen and (max-width:800px) 
	{
	#header
		{
		width:100%; height:71.25px;
		padding-top:15px; 
		padding-left:22px;
		padding-bottom:15px;
		top:0; left:0;
		-webkit-transform: translate(0,0%);
		   -moz-transform: translate(0,0%);
				transform: translate(0,0%);
		}	
	}
#logo
	{
	width:200px; height:55px;
	position: relative;
	}
body:not(.home) #topline
	{
	width:100%; height:0;
	background-color: rgba(255, 255, 255, 0);
	position: fixed;
	top:0; left:0; right:0;
	z-index:10;
	}
@media screen and (max-width:800px) 
	{
	#logo
		{
		margin-top:0;
		}	
	body:not(.home) #topline
		{
		height:80px;
		background-color: rgba(255, 255, 255, 0.5);
		}
	}
@media screen and (max-width:480px) 
	{
	#logo
		{
		width:150px; height:41.25px;
		}	
	body:not(.home) #topline
		{
		height:65px;
		background-color: rgba(255, 255, 255, 0.5);
		}
	}
#logo img
	{
	position: absolute;
	top:0; left:0; right:0;
	width:100%;
	-webkit-transition-property: all;
	   -moz-transition-property: all;
		 -o-transition-property: all;
			transition-property: all;
	-webkit-transition-duration: 2.5s;
	   -moz-transition-duration: 2.5s;
		 -o-transition-duration: 2.5s;
			transition-duration: 2.5s;
	opacity: 0;	
	}
#logo img:first-of-type
	{
	opacity: 1;
	}
.schwarz #logo img.schwarz
	{
	opacity: 1;
	}
.schwarz #logo img.weiss
	{
	opacity: 0;
	}
.weiss #logo img.weiss
	{
	opacity: 1;
	}
.weiss #logo img.schwarz
	{
	opacity: 0;
	}
/* MENU */
.menuicon {
	z-index: 11;
	position: absolute;
	top:15px; right:26px;
	display:  inline-block;
	width: 30px;
	height: 30px;
	margin: 0;
	-webkit-transition-property: all;
	   -moz-transition-property: all;
		 -o-transition-property: all;
			transition-property: all;
	-webkit-transition-duration: 0.5s;
	   -moz-transition-duration: 0.5s;
		 -o-transition-duration: 0.5s;
			transition-duration: 0.5s;
	opacity: 0;
	pointer-events: none;
	}
@media screen and (max-width:800px) 
	{
	.menuicon
		{
		opacity: 1;
		pointer-events: all;
		}
	}
.menuicon span {
	margin: 0 auto;
	position: relative;
	top: 12px;
	}
.menuicon span
	 {
	width: 30px;
	height: 1px;
	background-color: black;
	display: block;
	-webkit-transition: background-color 2.5s, margin .5s, -webkit-transform .5s;
	   -moz-transition: background-color 2.5s, margin .5s,    -moz-transform .5s;
			transition: background-color 2.5s, margin .5s, 		   transform .5s;
	}
.weiss .menuicon span
	{
	background-color: white;
	}
.menuicon span:nth-of-type(1) 
	{
	margin-bottom: 6px;
	}
.menuicon span:nth-of-type(3) 
	{
	margin-top: 6px;
	}
	
.menuopen .menuicon {
	margin-top:9px;
	}
.menuopen .menuicon span:nth-of-type(1) {
	margin-bottom: -1px;
	-webkit-transform: rotate(45deg); transform: rotate(45deg);
	}
.menuopen .menuicon span:nth-of-type(2) {
	-webkit-transition-duration: 0.25s;
	   -moz-transition-duration: 0.25s;
			transition-duration: 0.25s;	
	background-color: rgba(0,0,0,0.0);
	}
.menuopen .menuicon span:nth-of-type(3) {
	margin-top: -1px;
	-webkit-transform: rotate(-45deg); transform: rotate(-45deg);
	}	
#menu
	{
	z-index:11;
	display: inline-block;
	margin-top:70px;
	position: relative;
	left:0;
	-webkit-transition-property: all;
	   -moz-transition-property: all;
		 -o-transition-property: all;
			transition-property: all;
	-webkit-transition-duration: 1.5s;
	   -moz-transition-duration: 1.5s;
		 -o-transition-duration: 1.5s;
			transition-duration: 1.5s;
	}
@media screen and (max-width:800px) 
	{
	#menu
		{
		position: absolute;
		top:10px;
		left:-120%;
		padding-top:2rem;
		}
	.menuopen #menu
		{
		overflow:auto;
		left:22px;
		}
	}
.menu-item a
	{
	text-decoration: none;
	font-size:16px;
	line-height:28px;
	font-weight:300;
	color:black;
	-webkit-transition:opacity 1.5s, color 2.5s, padding .75s ease-in-out;
	   -moz-transition:opacity 1.5s, color 2.5s, padding .75s ease-in-out;
		 -o-transition:opacity 1.5s, color 2.5s, padding .75s ease-in-out;
			transition:opacity 1.5s, color 2.5s, padding .75s ease-in-out;
	}
@media screen and (max-width:800px) 
	{
	li.menu-item a
		{
		font-size:16px;
		line-height:28px;
		}
	}
.weiss .menu-item a
	{
	color:white;
	}
.menu-item.current-menu-item a
	{
	padding-left:10px;
	opacity: .4;
	}
.menu-item-object-custom a[href^="#"]
	{
	color: transparent !important;
	display: none;
	display: block;
	height:10px;
	pointer-events: none;
	}
#overlay
	{
	z-index:2;
	pointer-events: none;
	position: fixed;
	top:0; right:0; bottom:0; left:0;
	background-color: rgba(0,0,0,0);
	-webkit-transition-property: all;
	   -moz-transition-property: all;
		 -o-transition-property: all;
			transition-property: all;
	-webkit-transition-duration: 0.5s;
	   -moz-transition-duration: 0.5s;
		 -o-transition-duration: 0.5s;
			transition-duration: 0.5s;	
	}
@media screen and (max-width:800px) 
	{
	.menuopen #overlay
		{
		pointer-events: all;
		background-color: rgba(255,255,255,.95);
		}
	.menuopen .home #overlay
		{
		pointer-events: all;
		background-color: rgba(0,0,0,.8);
		}
	.menuopen #overlay.schwarz
		{
		background-color: rgba(255,255,255,.95);
		}
	.menuopen #overlay.weiss
		{
		background-color: rgba(0,0,0,.8);
		}
	}
/* SLIDER */
#hiddenfirstslideimage
	{
	position: absolute;
	top:-100px;
	left:-100px;
	width:1px; height:1px;
	opacity:0;
	pointer-events: none
	}
#slider
	{
	z-index: 2;
	position: absolute;
	top:0; right:0; bottom:0; left:0;
	}
#slider > div
	{
	position: absolute;
	top:0; right:0; bottom:0; left:0;
	overflow:hidden;
	background-size: cover;
	background-position:right center;
	opacity: 0;
	-webkit-transition-property: all;
	   -moz-transition-property: all;
		 -o-transition-property: all;
			transition-property: all;
	-webkit-transition-duration: 2.5s;
	   -moz-transition-duration: 2.5s;
		 -o-transition-duration: 2.5s;
			transition-duration: 2.5s;	
	}
#slider > div.align_left
	{
	background-position:left center;
	}
#slider > div.align_center
	{
	background-position:center center;
	}
#slider > div.align_right
	{
	background-position:right center;
	}
#slider > div.active
	{
	opacity: 1;
	}



/* NEWS */




main.news article
	{
	position: relative;
	margin-bottom: 2px;
	}
@media screen and (max-width:800px) 
	{
	main.news article
		{
		padding-left: 22px;
		padding-right: 22px;
		}
	}
@media screen and (max-width:600px) 
	{
	main.news article
		{
		padding-bottom: 40px;
		}
	}
@media screen and (max-width:600px) 
	{
	main.news article .entry-summary
		{
		background-color: rgba(0,0,0, 0.03);
		padding:.5rem;
		}
	main.news article .entry-summary .wp-post-image
		{
		margin-top:-.5rem;
		margin-right:-.5rem;
		margin-bottom: 1rem;
		margin-left: -.5rem;
		width:calc( 100% + 1rem);
		}
	}



main.news a
	{
	text-decoration: none;
	color:black;
	}
main.news div.wp-post-image
	{
	background-size: cover;
	background-position: center center;
	position: relative;
	width:250px; height:150px;
	float:left; 
	margin-right: 20px;
	}
main.news div.wp-post-image::after	{
	content:'';
	position: absolute;
	top:0; right:0; 
	bottom:0; left:0;
	background-color: rgba(0, 0, 0, 0);
	display: block; 
	width:100%; height:100%;
	pointer-events: none;
	-webkit-transition-property: all;
	   -moz-transition-property: all;
		 -o-transition-property: all;
			transition-property: all;
	-webkit-transition-duration: 0.5s;
	   -moz-transition-duration: 0.5s;
		 -o-transition-duration: 0.5s;
			transition-duration: 0.5s;	
	}
main.news .entry-summary:hover div.wp-post-image::after	{
	background-color: rgba(0, 0, 0, 0.5);
	}

main.news .entry-summary
	{
	max-width: 800px;
	cursor: pointer;
	}
main.news .entry-summary p
	{
	opacity: .8;
	}
main.news .entry-summary hr
	{
	opacity: 0;
	}
@media screen and (min-width:801px) 
	{
	main.news .entry-summary hr
		{
		position: absolute;
		bottom:0; right:0;
		width:calc( 100% - 310px );
		height:1px;
		border:none;
		background-color:silver;
		margin:0;
		}
	}

@media screen and (max-width:600px) 
	{
	main.news div.wp-post-image
		{
		width:100%; height:0;
		padding-top:56.25%;
		float: none; 
		}
	}
.entry-content
	{
	max-width:800px;
	}
.entry-content img.attachment-post-thumbnail
	{
	width:100%; height:auto;
	}
@media screen and (max-width:800px) 
	{
	.entry-content
		{
		padding:0 20px; 
		}
	.entry-content img.attachment-post-thumbnail
		{
		width:calc( 100% + 40px );
		margin:0 -20px; 
		}
	}
.entry-content h1.entry-title	
	{
	margin-top: 20px;
	margin-bottom: 20px;
	display: block;
	font-weight:700;
	}


/* CONTENT */
#hiddencontainer
	{
	position: absolute;
	top:-1000px; left:-1000px;
	width:1px; height:1px; overflow: hidden;
	opacity: 0; pointer-events: none;
	}
#container
	{
	opacity: 0;
	pointer-events: none;
	-webkit-transition-property: all;
	   -moz-transition-property: all;
		 -o-transition-property: all;
			transition-property: all;
	-webkit-transition-duration: 1.5s;
	   -moz-transition-duration: 1.5s;
		 -o-transition-duration: 1.5s;
			transition-duration: 1.5s;	
	}
#container.active
	{
	opacity: 1;
	pointer-events: all;
	-webkit-transition-duration: 2.5s;
	   -moz-transition-duration: 2.5s;
		 -o-transition-duration: 2.5s;
			transition-duration: 2.5s;	
	}
#content
	{
	z-index: 2;
	background-color: white;
	width:100%;
	}
@media screen and (max-width:800px) 
	{
	body.contact main#content.padding_top
		{
		padding-top:85px !important;
		}	
	}
#content.scrollable
	{
	position: relative;
	top:0;
	-webkit-transform: translate(0,0);
	   -moz-transform: translate(0,0);
			transform: translate(0,0);
	}	
#content.vcenter
	{
	position: absolute;
	top:50%;
	-webkit-transform: translate(0,-50%);
	   -moz-transform: translate(0,-50%);
			transform: translate(0,-50%);
	}	
#content.vhcenter
	{
	white-space: nowrap;
	position: absolute;
	top:50%; left:50%;
	-webkit-transform: translate(-50%,-50%);
	   -moz-transform: translate(-50%,-50%);
			transform: translate(-50%,-50%);
	}	
#content.padding-top
	{
	white-space: nowrap;
	position: relative;
	top:0; left:0;
	-webkit-transform: translate(0,0);
	   -moz-transform: translate(0,0);
			transform: translate(0,0);
	}	
h1.entry-title	
	{
	display: none;
	}
	
/* about */
.about article .posrel
	{
	position: relative;
	max-width: 600px;
	}
.about #content img
	{
	width:100%; height:auto;
	max-width: 50%;
	height:auto;
	margin-bottom: 1rem;
	-webkit-background-clip: padding-box;
	   -moz-background-clip: padding;
			background-clip: padding-box;
	-webkit-transition-property: all;
	   -moz-transition-property: all;
		 -o-transition-property: all;
			transition-property: all;
	-webkit-transition-duration: 0.5s;
	   -moz-transition-duration: 0.5s;
		 -o-transition-duration: 0.5s;
			transition-duration: 0.5s;	
	}
@media screen and (max-width:800px) 
	{
	.about article .posrel
		{
		position: relative;
		max-width: 800px;
		}
	.about #content img
		{
		max-width: 100%;
		margin: 0 auto;
		display: block;
		}
	}
.bildbeschriftung
	{
	position: absolute;
	bottom:0; left:50%;
	max-width: 50%;
	display: block;
	overflow: hidden; 
	padding-left:22px;
	margin-bottom: 1rem;
	}
@media screen and (max-width:800px) 
	{
	.bildbeschriftung
		{
		padding-top:22px;
		position: relative;
		bottom:0; left:0;
		}
	}

.text-content
	{
	clear:both;
	display: block;
	overflow: hidden; 
	max-width:800px;
	}
@media screen and (max-width:800px) 
	{
	.text-content
		{
		padding-left: 22px;
		padding-right: 22px;
		}
	}
.text-content p
	{
	margin-bottom:1rem;
	}
/* Categories */
#content.categories
	{
	padding-top:15px;
	position: relative;
	line-height:0.1px;
	position: absolute;
	top:50%; width:100%;
	max-width: 2560px;
	-webkit-transform: translate(0,-50%);
	   -moz-transform: translate(0,-50%);
			transform: translate(0,-50%);
	-webkit-transition-property: all;
	   -moz-transition-property: all;
		 -o-transition-property: all;
			transition-property: all;
	-webkit-transition-duration: 0.25s;
	   -moz-transition-duration: 0.25s;
		 -o-transition-duration: 0.25s;
			transition-duration: 0.25s;	
	}
@media screen and (max-width:800px) 
	{
	#content.categories
		{
		position: relative;
		top:0;
		-webkit-transform: translate(0,0);
		   -moz-transform: translate(0,0);
				transform: translate(0,0);
		}	
	}
#content.categories.scrollable
	{
	position: relative;
	top:0;
	-webkit-transform: translate(0,0);
	   -moz-transform: translate(0,0);
			transform: translate(0,0);
	}	
body:not(.home) #content
	{
	padding:15px;
	padding-left:400px;
	padding-right:400px;
	}	
@media screen and (max-width:1339px) 
	{
	body:not(.home) #content
		{
		padding-left:350px;
		padding-right: 350px;
		}	
	}
@media screen and (max-width:1280px) 
	{
	body:not(.home) #content
		{
		padding-left:300px;
		padding-right:300px;
		}	
	}
@media screen and (max-width:1024px) 
	{
	body:not(.home) #content
		{
		padding-left:270px;
		padding-right:15px;
		}	
	}
@media screen and (max-width:960px) 
	{
	body:not(.home) #content
		{
		padding-top:80px; 
		}	
	}
@media screen and (max-width:800px) 
	{
	body:not(.home) #content
		{
		padding-top:80px; 
		padding-left:0;
		padding-right:0;
		}	
	}
@media screen and (max-width:480px) 
	{
	body:not(.home) #content
		{
		padding-top:65px; 
		padding-left:0;
		padding-right:0;
		}	
	}

#content.categories > div.subcategory_item
	{
	margin:2.5px;
	display: inline-block;
	width:calc(20% - 5px); /* 5 columns */
	background-position: center center;
	background-size: cover;
	position: relative;
	-webkit-transform: translate3d(0,0,0);
	   -moz-transform: translate3d(0,0,0);
		 -o-transform: translate3d(0,0,0);
			transform: translate3d(0,0,0);
	}
@media screen and (max-width:1920px) 
	{
	#content.categories > div.subcategory_item
		{
		width:calc(25% - 5px); /* 4 columns */
		}	
	}
@media screen and (max-width:1700px) 
	{
	#content.categories > div.subcategory_item
		{
		width:calc(33.3332% - 5px); /* 3 columns */
		}	
	}
@media screen and (max-width:1500px) 
	{
	#content.categories > div.subcategory_item
		{
		width:calc(50% - 5px); /* 2 columns */
		}	
	}
/*
@media screen and (max-width:1339px) 
	{
	#content.categories > div.subcategory_item
		{
		width:calc(33.3332% - 1px); 
		}	
	}
@media screen and (max-width:1280px) 
	{
	#content.categories > div.subcategory_item
		{
		width:calc(33.3332% - 1px); 
		}	
	}
@media screen and (max-width:1024px) 
	{
	#content.categories > div.subcategory_item
		{
		width:calc(50% - 5px);
		}	
	}
@media screen and (max-width:800px) 
	{
	#content.categories > div.subcategory_item
		{
		width:calc(50% - 5px);
		}	
	}
*/
@media screen and (max-width:640px) 
	{
	#content.categories > div.subcategory_item
		{
		width:100%; /* 1 columns */
		}	
	}
#content.categories .subcategory_item_sizer
	{
	padding-top:56.25%;
	}
#content.categories a.category_link
	{
	display: inline-block;
	}
#content.categories a.category_link > div
	{
	display: inline-block;
	position: absolute;
	top:0; right:0; bottom:0; left:0;
	background-color: rgba(0,0,0,.5);
	opacity: 0;	
	-webkit-transition-property: all;
	   -moz-transition-property: all;
		 -o-transition-property: all;
			transition-property: all;
	-webkit-transition-duration: 0.5s;
	   -moz-transition-duration: 0.5s;
		 -o-transition-duration: 0.5s;
			transition-duration: 0.5s;	
	
	}
#content.categories a.category_link > div:hover, 
.mobile #content.categories a.category_link > div
	{
	opacity: 1;	
	}
@media screen and (max-width:800px) 
	{
	#content.categories a.category_link > div
		{
		opacity: 1;	
		}
	}
#content.categories a.category_link > div > p
	{
	text-transform: uppercase;
	pointer-events: none;
	font-weight:400;
	font-size:16px;
	line-height:20px;
	color:rgba(255, 255, 255, 0.75);
	position: absolute;
	top:50%; left:50%;
	display: inline-block;
	width:100%;
	text-align: center;
	-webkit-transform: translate(-50%,-50%);
	   -moz-transform: translate(-50%,-50%);
			transform: translate(-50%,-50%);
	}
/*
@media screen and (max-width:1280px) 
	{
	#content.categories a.category_link > div > p
		{
		font-size:13px;
		}
	}
@media screen and (max-width:800px) 
	{
	#content.categories a.category_link > div > p
		{
		font-size:12px;
		}
	}
*/	
	
	
	
/* Masonry grid */

#content.gallery
	{
	position: relative;
	top:0; width:100%;
	-webkit-transform: translate(0,0);
	   -moz-transform: translate(0,0);
			transform: translate(0,0);
	-webkit-transition-property: all;
	   -moz-transition-property: all;
		 -o-transition-property: all;
			transition-property: all;
	-webkit-transition-duration: 0.5s;
	   -moz-transition-duration: 0.5s;
		 -o-transition-duration: 0.5s;
			transition-duration: 0.5s;	
	}
#content.gallery.vcenter
	{
	position: absolute;
	top:50%;
	-webkit-transform: translate(0,-50%);
	   -moz-transform: translate(0,-50%);
			transform: translate(0,-50%);
	}


body:not(.home) #content:not(.categories):not(.vhcenter)
	{
	padding:15px;
	padding-left:400px;
	padding-right:400px;
	}	
@media screen and (max-width:1339px) 
	{
	body:not(.home) #content:not(.categories):not(.vhcenter)
		{
		padding-left:350px;
		padding-right:15px;
		}	
	}
@media screen and (max-width:1280px) 
	{
	body:not(.home) #content:not(.categories):not(.vhcenter)
		{
		padding-left:300px;
		padding-right:15px;
		}	
	}
@media screen and (max-width:1024px) 
	{
	body:not(.home) #content:not(.categories):not(.vhcenter)
		{
		padding-left:270px;
		padding-right:15px;
		}	
	}
@media screen and (max-width:960px) 
	{
	body:not(.home) #content:not(.categories):not(.vhcenter)
		{
		padding-top:80px;
		}	
	}
@media screen and (max-width:800px) 
	{
	body:not(.home) #content:not(.categories):not(.vhcenter)
		{
		padding-top:80px;
		padding-left:0;
		padding-right:0;
		}	
	}
@media screen and (max-width:480px) 
	{
	body:not(.home) #content:not(.categories):not(.vhcenter)
		{
		padding-top:65px;
		padding-left:0;
		padding-right:0;
		}	
	}
.grid
	{
	width:100%;
	}
.grid-sizer,
.grid-item 
	{ 
	width: 20%; 
	padding:5px;
	}
.grid-item
	{ 
	line-height:0;
	font-size:0;
	}
@media screen and (max-width:2560px) 
	{
	.grid-sizer,
	.grid-item 
		{ 
		width: 25%; 
		}
	}
@media screen and (max-width:1920px) 
	{
	.grid-sizer,
	.grid-item 
		{ 
		width: 33.33333333333333333333%; 
		}
	}
@media screen and (max-width:1650px) 
	{
	.grid-sizer,
	.grid-item 
		{ 
		width: 33.33333333333333333333%; 
		}
	}
@media screen and (max-width:1339px) 
	{
	.grid-sizer,
	.grid-item 
		{ 
		width: 33.33333333333333333333%; 
		}
	}
@media screen and (max-width:1280px) 
	{
	.grid-sizer,
	.grid-item 
		{ 
		width: 33.33333333333333333333%; 
		}
	}
@media screen and (max-width:960px) 
	{
	.grid-sizer,
	.grid-item 
		{ 
		width: 50%; 
		}
	}
@media screen and (max-width:800px) 
	{
	.grid-sizer,
	.grid-item 
		{ 
		width: 50%; 
		}
	}
@media screen and (max-width:480px) 
	{
	.grid-sizer,
	.grid-item 
		{ 
		width: 100%; 
		padding:5px 0;
		}
	}
.grid-item::after	{
	content:'';
	position: absolute;
	top:5px; right:5px; 
	bottom:5px; left:5px;
	background-color: rgba(0, 0, 0, 0);
	display: block; 
	width:calc(100% - 10px); height:calc(100% - 10px);
	pointer-events: none;
	-webkit-transition-property: all;
	   -moz-transition-property: all;
		 -o-transition-property: all;
			transition-property: all;
	-webkit-transition-duration: 0.5s;
	   -moz-transition-duration: 0.5s;
		 -o-transition-duration: 0.5s;
			transition-duration: 0.5s;	
	}
@media screen and (max-width:480px) 
	{
	.grid-item::after	{
		content:'';
		position: absolute;
		top:5px; right:0; 
		bottom:5px; left:0;
		background-color: rgba(0, 0, 0, 0);
		display: block; 
		width:100%; height:calc(100% - 10px);
		}
	}
.grid-item:hover::after	{
	background-color: rgba(0, 0, 0, 0.5);
	}

.grid-item img
	{
	width:100%;
	position: relative;
	}
		
#permalinks
	{
	display: none;
	}
.permalink
	{
	position: absolute;
	top:0; left:0;
	opacity: 0;
	pointer-events: none;
	}
	
	
	
	
	
#spinner {
	opacity: 0;
	pointer-events: none;
	width: 70px;
	height: 70px;
	margin: 0;
	background: transparent;
	border-top: 1px solid silver;
	border-right: 1px solid transparent;
	border-radius: 50%;
	-webkit-animation: 1s spin linear infinite;
	animation: 1s spin linear infinite;
	position: fixed;
	top:calc(50% - 35px); left:calc(50% - 35px);
	-webkit-transition-property: opacity;
	   -moz-transition-property: opacity;
		 -o-transition-property: opacity;
			transition-property: opacity;
	-webkit-transition-duration: 0.5s;
	   -moz-transition-duration: 0.5s;
		 -o-transition-duration: 0.5s;
			transition-duration: 0.5s;	
	}	
#spinner.active {
	opacity: 1;
	}	

@-webkit-keyframes spin {
  from {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@keyframes spin {
  from {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
.pswp--animated-in .pswp__bg, .pswp--animated-in .pswp__zoom-wrap, 
div.pswp__bg
	{
	background-color: white;
	}
	
.pswp--svg button.pswp__button--arrow--right:before
	{
	width:24px; height:24px;
	right:14px;
	background-image:url(img/arrow_right_black.png);
	background-size: cover;
	background-position: center center;
	}	
.pswp--svg button.pswp__button--arrow--left:before
	{
	width:24px; height:24px;
	left:14px;
	background-image:url(img/arrow_left_black.png);
	background-size: cover;
	background-position: center center;
	}	
.pswp video
	{
	-webkit-animation:fadeIn ease-in 1; /* play the “fadeIn” keyframe useing a "ease-in" animation and only do it once "1".*/
	-moz-animation:fadeIn ease-in 1;
	-o-animation:fadeIn ease-in 1;
	animation:fadeIn ease-in 1;
	-webkit-animation-fill-mode:forwards; /* This is used to tell the animation not to reset to 0 once it is complete. It well hold the “100%” or “to” status of the keyframe.*/
	-moz-animation-fill-mode:forwards;
	-o-animation-fill-mode:forwards;
	animation-fill-mode:forwards;
	-webkit-animation-duration:1.2s;/* duration of animation */
	-moz-animation-duration:1.2s;
	-o-animation-duration:1.2s;
	animation-duration:1.2s;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	max-width: 70vw;
	height:auto;
	}
@media screen and (max-width:1024px) 
	{
	.pswp video
		{
		-webkit-animation:fadeIn ease-in 1; /* play the “fadeIn” keyframe useing a "ease-in" animation and only do it once "1".*/
		-moz-animation:fadeIn ease-in 1;
		-o-animation:fadeIn ease-in 1;
		animation:fadeIn ease-in 1;
		-webkit-animation-fill-mode:forwards; /* This is used to tell the animation not to reset to 0 once it is complete. It well hold the “100%” or “to” status of the keyframe.*/
		-moz-animation-fill-mode:forwards;
		-o-animation-fill-mode:forwards;
		animation-fill-mode:forwards;
		-webkit-animation-duration:1.2s;/* duration of animation */
		-moz-animation-duration:1.2s;
		-o-animation-duration:1.2s;
		animation-duration:1.2s;
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		max-width: 100%;
		height:auto;
		}
	}
/* Pure CSS FadeIn Key Frames
---------------------------------------------------- */
@-webkit-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@-moz-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@-o-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@keyframes fadeIn { from { opacity:0; } to { opacity:1; } }