@font-face {
  font-family: 'Merriweather';
  font-style: normal;
  font-weight: 400;
  src: url('/fonts/merriweather-v22-latin-ext_latin_cyrillic-ext_cyrillic-regular.woff2') format('woff2');
}

@font-face {
  font-family: 'PT Serif';
  font-style: normal;
  font-weight: 400;
  src: url('/fonts/pt-serif-v12-latin-ext_latin_cyrillic-ext_cyrillic-regular.woff2') format('woff2');
}

@font-face {
  font-family: 'Material Icons';
  font-style: normal;
  font-weight: 400;
  src: url('/fonts/material.woff2') format('woff2');
}


.material-icons {
  font-family: 'Material Icons';
  font-weight: normal;
  font-style: normal;
  font-size: 24px;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: 'liga';
  -webkit-font-smoothing: antialiased;
  /*background: linear-gradient(45deg, #000000 33%, #4C4970 66%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;*/
}

html {
    min-height:100% !important;
	width: 100% !important;
}
html, body {
	height: 100% !important;
	width: 100% !important;
	background-color:#000 !important;
	font-family:'PT Serif' !important;
	font-size:1rem !important;
	color:#fff;
	margin: 0px !important;
	padding: 0px !important;
}
image {
	border: 0px !important;
	margin: 0px;
	padding: 0px;
}
a {
	color: #fff !important;
	text-decoration: underline;
}
a:visited {
	color: #fff !important;
	text-decoration: underline;
}
a:hover {
	color: #fff !important;
	text-decoration: none;
}
.border {
	border: 1px solid #fff;
}
.hidden {
	display:none;
}
.visible {
	visibility: visible;
}


ymaps > a {
	color: #000 !important;
}
#specs-geo-data {
	color: #fff !important;
	text-decoration: none;
}

#category-sort {
	padding: 1rem;
	line-height: 2rem;
}
.sortorder-notselected {
	text-decoration: dashed underline;
	cursor: pointer;
	padding: 5px;
}
.sortorder-selected {
	padding: 5px;
	background-color: #fff;
	color: #000 !important;
	border-radius: 6px;
	cursor: pointer;
}

@media (min-width: 900px) {
	
	#load-wait {
		display: grid;
		grid-template-rows: 100vh;
		grid-template-columns: 100%;
		grid-gap: 0px;
		position: absolute;
		top: 0px;
		left: 0px;
		width: 100%;
		z-index: 1000;
		background-color: #000;
		height: 100vh;
		align-items: center;
		justify-items: center;
		opacity: 0.9;
	}
	#mobile-welcome {
		display: none;
	}
	
	#topmenu-container-mobile {
		display: none;
	}
	#topmenu-mobile-open {
		display: none;
	}
	
	#topmenu-container-desktop {
		display: grid;
		grid-template-rows: 60px;
		grid-template-columns: 5% 20% 75%;
		grid-gap: 0px;
		position: absolute;
		top: 0px;
		left: 0px;
		width: 100%;
		z-index: 100;
		background-color: #000;
		height: 60px;
		align-items: center;
		justify-items: center;
	}
	#topmenu-logo-desktop {
		background-color: #000;
	}
	#topmenu-logo-desktop > a > img {
		max-height: 40px;
		max-width: 40px;
		width: 40px;
		height: 40px;
	}
	#topmenu-name-desktop {
		background-color: #000;
		width: 100%;
		height: 100%;
		display: grid;
		grid-template-rows: 100%;
		grid-template-columns: 100%;
		grid-gap: 0px;
		align-items: center;
		justify-items: center;
	}
	#topmenu-name-desktop > a {
		font-size: 1.2rem;
		color: #fff;
		text-decoration: none;
	}
	#topmenu-albums-desktop {
		position: absolute;
		top: 60px;
		left: 5%;
		width: 600px;
		z-index: 100;
		background-color: #000;
		opacity: 0.8;
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		justify-content: space-evenly;
		align-items: center;
	}
	#topmenu-albums-desktop > a {
		padding: 5px;
		margin: 5px;
		font-size: 1.2rem;
		color: #fff !important;
		text-decoration: none !important;
		display: block;
	}
	#topmenu-albums-desktop > a:visited {
		color: #fff !important;
		text-decoration: none !important;
	}
	#topmenu-albums-desktop > a:hover {
		color: #fff !important;
		text-decoration: underline !important;
	}
	#topmenu-search-desktop {
		justify-content: start;
	}
	#topmenu-search-results {
		position: absolute;
		z-index: 15;
		background-color: #fff;
		width: 390px;
		padding: 10px;
		top: 50px;
		font-size: 1em;
		color: #000 !important;
		border-radius: 6px 6px 6px 6px;
	}
	.topmenu-search-results-item {
		display: grid;  
		grid-gap: 0px;  
		grid-template-columns: 100px 500px; 
		padding: 10px;
		color: #000 !important;
	}
	.topmenu-search-results-item-img > a > img {
		width: 70px;  
		height: 70px;  
		object-fit: cover;
		image-rendering: crisp-edges;  
	}
	.topmenu-search-results-item-title > a {
		color: #000 !important;
	}
	.topmenu-search-results-num > a {
		color: #000 !important;
	}
	#search-desktop-form {
		padding: 0px !important;
		margin: 0px !important;
		width: 700px;
		justify-self: start;
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		justify-content: flex-start;
		align-items: center;
	}
	#search-desktop-input {
		border: 0px !important;
		background-color: #fff;
		color: #000;
		width: 25rem;
		height: 22px;
		outline: 0;
		padding: 4px;
		border-radius: 6px 0px 0px 6px;
	}
	#search-desktop-input:focus {
		border: 0px !important;
	}
	#search-desktop-input:hover {
		border: 0px !important;
	}
	#search-desktop-button {
		height: 30px;
		border: 0px;
		border-left: 1px solid #ccc;
		background-color: #fff;
		padding: 0px 6px 0px 6px;
		margin: 0px;
		width: 5rem;
		border-radius: 0px 6px 6px 0px;
		font-family:'PT Serif' !important;
	}
	#search-desktop-button > span {
		font-size: 28px;
	}
	
	#main-container-gallery {
		display: grid;
		grid-template-rows: 100vh;
		grid-template-columns: 10% 80% 10%;
		grid-gap: 0px;
		align-items: center;
		justify-items: center;
		max-height: 100vh;
		height: 100vh;
	}
	.gallery-nav-desktop {
		width: 100%;
		align-items: center;
		justify-items: center;
	}
	.gallery-a {
		display: block;
		width: 100%;
		align-items: center;
		justify-items: center;
		text-align: center;
	}
	.gallery-a > span {
		font-size:3.5rem !important;
		color: #fff !important;
		text-decoration: none !important;
	}
	#main-container-gallery-middle {
		max-height: 100vh;
		height: 100vh;
		align-items: center;
		justify-items: center;
	}
	#gallery-image {
		max-width: 100%;
		max-height: 100%;
		image-rendering: -webkit-optimize-contrast;
	}
	
	#photo-overlay {
		background-color: #000;
		opacity: 0.6;
		position: absolute;
		z-index: 90;
		top: 0px;
		left: 0px;
		width: 100%;
		height: 100%;
		margin: auto;
	}
	#photo-info-block {
		position: absolute;
		z-index: 91;
		top: 50%;
		left: 60%;
		margin-right: -50%;
		transform: translate(-50%, -50%);
		width: 50%;
		height: 100%;
		margin: auto;
	}
	#photo-info {
		width: 100%;
		height: 100%;
		display: grid;
		grid-template-rows: 100vh;
		grid-template-columns: 100%;
		grid-gap: 0px;
		align-items: center;
		justify-items: center;
		max-height: 100vh;
		height: 100vh;
	}
	#photo-info-middle {
		width: 100%;
	}
	#photo-info-h1 {
		font-size: 3rem;
		font-weight: 400;
		font-family: 'Merriweather';
		margin: 0px;
		padding: 0px;
	}
	#photo-info-h2 {
		font-size: 1.1rem;
		font-weight: 400;
		margin: 0px 0px 1rem 0px;
		padding: 0px;
	}
	#photo-info-specs {
		width: inherit;
	}
	.specs-block {
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		justify-content: flex-start;
		align-items: center;
	}
	.specs-title {
		width: 30%;
		padding-left: 1rem;
	}
	.specs-data {
		width: 50%;
	}
	#index-splash {
		margin-top: 6rem;
	}
	#index-splash-box {  
		margin-top: 6rem;
		display: grid;  
		grid-gap: 5px;  
		grid-template-columns: 350px 350px 1fr;  
	}
	#index-splash-left {
		width: 350px;
	}
	#index-splash-box > div > img {
		width: 175px;  
		height: 175px;  
		object-fit: cover;
	}
	#index-author-img {
		width: 175px;  
		height: 175px;  
		object-fit: cover;
	}
	#index-splash-about {
		padding: 1rem;
	}
	
	#index-h1 {
		font-size: 2.5rem;
		font-weight: 400;
		padding: 0px;
		margin: 0px;
	}
	.category-img-link > a {
		text-decoration: none;
	}
	
	#index-top {
		margin-bottom: 2em;
	}
	#index-top-title {
		font-size: 2.5rem;
		font-weight: 400;
		margin-bottom: 1em;
		text-align: center;
	}
	#index-top-items {  
		display: grid;  
		grid-gap: 5px;  
		grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));  
		align-items: center;
		justify-items: center;
	}
	.index-top-item > a > img {
		max-width: 340px;
		max-height: 240px;
	}
	
	#category-sort {
		margin-top: 4rem;
	}
	.category-container {  
		display: grid;  
		grid-gap: 5px;  
		grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));  
		align-items: center;
		justify-items: center;
	}
	.category-name > h1 {
		font-size: 2.5rem;
		font-weight: 400;
		padding: 0px;
		margin: 0px;
	}
	.category-container > div > a > img {  
		width: 350px;  
		height: 350px;  
		object-fit: cover;  
		margin: 0px;
		image-rendering: crisp-edges;
	}
	.category-container > div > a > img:hover {  
		filter: grayscale(100%);
		opacity: 0.6;
	}
	.category-img-info {
		padding-bottom: 2rem;
		text-align: center;
	}
	.category-img-h2 {
		font-size:1.3rem;
		font-weight: 400;
		text-decoration: none;
		padding: 0px;
		margin: 0px;
	}
	.category-img-h2 > a {
		text-decoration: none !important;
	}
	.category-img-descr > a {
		text-decoration: none !important;
	}
	
	#pagination {
		display: flex;
		flex-direction: row;
		flex-wrap: nowrap;
		justify-content: flex-start;
		align-items: center;
		font-size: 1.5rem;
		margin-left: 1rem;
	}
	.page_block {
		padding: 0.5rem;
		width: 2rem;
		text-align: center;
	}
	.page_block > a {
		text-decoration: none !important;
	}
	#page_block_curr {
		background-color: #fff;
		
		color: #000;
	}
	
	#footer {
		display: grid;
		grid-template-rows: 60px;
		grid-template-columns: 100%;
		grid-gap: 0px;
		align-items: center;
		justify-items: center;
		position: absolute;
		bottom: 0px;
		left: 0px;
		width: 100%;
		background-color: #000;
		z-index: 95;
	}
}

/* ############################################################################################################################## */

@media (max-width: 899px) {
	
	#mobile-welcome {
		opacity: 0.9;
		display: grid;
		grid-template-rows: 100vh;
		grid-template-columns: 100%;
		grid-gap: 0px;
		background-color: #000;
		width: 100%;
		position:absolute;
		top: 0px;
		left: 0px;
		height: 100vh;
		align-items: center;
		justify-items: center;
		z-index:15000;
		color: #fff;
		padding: 0px;
		font-size: 1rem;
		text-align: center;
	}
	#mobile-welcome-text > div {
		margin-bottom: 1rem;
	}
	#mobile-welcome-swipe {
		max-width: 20%;
	}
	#mobile-welcome-close {
		text-decoration: underline;
		margin-top:1rem;
		font-size: 1.5rem;
	}
	#topmenu-container-desktop {
		display: none;
	}
	#topmenu-container-mobile {
		display: flex;
		flex-direction: row;
		flex-wrap: nowrap;
		justify-content: flex-start;
		align-items: center;
		padding: 1rem;
	}
	#topmenu-hamburger {
		align-items: flex-end;
		padding-right: 1rem;
	}
	#topmenu-hamburger > span {
		font-size: 2rem !important;
		display: block !important;
	}
	#topmenu-name > a {
		text-decoration: none;
		font-size: 1.2rem;
	}
	#topmenu-mobile-open {
		display: none;
		padding: 1rem;
	}
	#topmenu-search-m {
		width: 90%;
	}
	#topmenu-search-input-m {
		width: 90%;	
		border: 0px !important;
		background-color: #fff;
		color: #000;
		height: 22px;
		outline: 0;
		padding: 4px;
		border-radius: 6px;
	}
	#topmenu-search-input-m:focus {
		border: 0px !important;
	}
	#topmenu-search-input-m:hover {
		border: 0px !important;
	}
	#topmenu-search-results-m {
		position: absolute;
		z-index: 15;
		width: 80%;
		background-color: #fff;
		padding: 10px;
		top: 120px;
		font-size: 1em;
		color: #000 !important;
		border-radius: 6px 6px 6px 6px;
	}
	.topmenu-search-results-item {
		display: flex;  
		flex-direction: row;
		flex-wrap: no-wrap;
		justify-content: flex-start;
		align-items: center; 
		color: #000 !important;
	}
	.topmenu-search-results-item-img {
		padding: 10px;
	}
	.topmenu-search-results-item-title {
		padding: 10px;
	}
	.topmenu-search-results-item-img > a > img {
		width: 50px;  
		height: 50px;  
		object-fit: cover;
		image-rendering: crisp-edges;  
	}
	.topmenu-search-results-item-title > a {
		color: #000 !important;
	}
	.topmenu-search-results-num > a {
		color: #000 !important;
	}
	#topmenu-albums-m {
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		justify-content: flex-start;
		align-items: flex-start;
	}
	#topmenu-albums-m > a {
		padding: 5px;
		margin: 5px;
		font-size: 1rem;
		color: #fff !important;
		text-decoration: none !important;
		display: block;
	}
	#topmenu-albums-m > a:visited {
		color: #fff !important;
		text-decoration: none !important;
	}
	#topmenu-albums-m > a:hover {
		color: #fff !important;
		text-decoration: underline !important;
	}
	
	#load-wait {
		display: grid;
		grid-template-rows: 100vh;
		grid-template-columns: 100%;
		grid-gap: 0px;
		position: absolute;
		top: 0px;
		left: 0px;
		width: 100%;
		z-index: 1000;
		background-color: #000;
		height: 100vh;
		align-items: center;
		justify-items: center;
		opacity: 0.9;
	}
	
	#main-container-gallery {
		max-width: 100%;
	}
	#gallery-image {
		max-width: 100%;
	}
	#main-container-gallery-left {
		display: none;
	}
	#main-container-gallery-right {
		display: none;
	}
	#photo-info-block {
		margin: 20px;
	}
	#photo-info {
		width: 100%;
		display: grid;
		grid-template-columns: 100%;
		grid-gap: 0px;
		align-items: center;
		justify-items: center;
	}
	#photo-info-middle {
		width: 100%;
	}
	#photo-info-h1 {
		font-size: 1.7rem;
		font-weight: 400;
		font-family: Merriweather;
		margin: 0px;
		padding: 0px;
	}
	#photo-info-h2 {
		font-size: 1rem;
		font-weight: 400;
		margin: 0px 0px 1rem 0px;
		padding: 0px;
	}
	#photo-info-specs {
		width: inherit;
	}
	.specs-block {
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		justify-content: flex-start;
		align-items: flex-start;
	}
	.specs-title {
		width: 30%;
		padding-left: 1rem;
		padding-right: 0.5rem;
		padding-bottom: 0.5rem;
	}
	.specs-data {
		width: 50%;
		padding-bottom: 0.5rem;
	}
	
	#index-splash-box {  
		margin-top: 6rem;
		display: grid;  
		grid-gap: 5px;  
		grid-template-columns: 350px 350px 1fr;  
	}
	#index-splash-left {
		width: 350px;
	}
	#index-splash-box > div > img {
		width: 175px;  
		height: 175px;  
		object-fit: cover;
	}
	#index-author-img {
		width: 175px;  
		height: 175px;  
		object-fit: cover;
	}
	#index-splash-about {
		padding: 1rem;
	}
	
	#index-h1 {
		font-size: 2.5rem;
		font-weight: 400;
		padding: 0px;
		margin: 0px;
	}
	.category-img-link > a {
		text-decoration: none;
	}
	
	#index-top {
		margin-bottom: 2em;
	}
	#index-top-title {
		font-size: 2.5rem;
		font-weight: 400;
		margin-bottom: 1em;
		text-align: center;
	}
	#index-top-items {  
		display: grid;  
		grid-gap: 5px;  
		grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));  
		align-items: center;
		justify-items: center;
	}
	.index-top-item > a > img {
		max-width: 100%;
	}
	
	#category-sort {
		margin-top: 1rem;
	}
	#category-presentation {
		margin-top: 1rem;
	}
	.category-container {  
		display: grid;  
		grid-gap: 5px;  
		grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));  
		align-items: center;
		justify-items: center;
	}
	.category-name > h1 {
		font-size: 2.5rem;
		font-weight: 400;
		padding: 0px;
		margin: 0px;
	}
	.category-container > div > a > img {  
		max-width: 100%;    
		margin: 0px;
		image-rendering: crisp-edges;
	}
	.category-container > div > a > img:hover {  
		filter: grayscale(100%);
		opacity: 0.6;
	}
	.category-img-info {
		padding-bottom: 2rem;
		text-align: center;
	}
	.category-img-h2 {
		font-size:1.3rem;
		font-weight: 400;
		text-decoration: none;
		padding: 0px;
		margin: 0px;
	}
	.category-img-h2 > a {
		text-decoration: underline;
	}
	.category-img-descr > a {
		text-decoration: none !important;
	}
	
	#pagination {
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		justify-content: flex-start;
		align-items: center;
		font-size: 1rem;
		margin-left: 1rem;
	}
	.page_block {
		padding: 0.5rem;
		width: 2rem;
		text-align: center;
	}
	.page_block > a {
		text-decoration: none !important;
	}
	#page_block_curr {
		background-color: #fff;
		
		color: #000;
	}
	
	
	#footer {
		padding: 1rem;
	}
	
}	

