/*************************************
 **** media listing ******************
 ************************************/

.media-content {
	padding: 25px 0;
	display: none;
	clear: both;
}

.media-content h3 {
	margin-bottom: 12px;
}

.media-item {
	display: block;
	margin: 10px 0;
	min-height: 69px;
	position: relative;
	padding: 5px 10px 5px 130px;
	border: 1px solid #fff;
	clear: both;
}
.media-item:hover {
	box-shadow: -1px 1px 7px 5px rgba(0,0,0,0.04);
	border-color: #f0f0f0;
}

.media-item .image {
	height: 67px;
	width: 120px;
	overflow: hidden;
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	text-align: center;
}

.media-item .image img {
	height: 100%;
	width: auto;
}

.iobject-gallery:hover .title:after {
	content: '(Galerie)';
	color: #888;
	font-size: 12px;
	margin-left: 10px;
}

.iobject-info_graphic:hover .title:after {
	content: '(Infografika)';
	color: #888;
	font-size: 12px;
	margin-left: 10px;
}

.iobject-embedded_video:hover .title:after {
	content: '(Video)';
	color: #888;
	font-size: 12px;
	margin-left: 10px;
}

.preview-frame {
	position: relative;
	display: inline-block;
	max-width: 1200px;
	margin: auto;
	height: 100%;
}

/*************************************
 **** gallery placeholder ************
 ************************************/

.gallery-info				{ margin-top: 20px; }
.gallery-info h2			{ margin: 0; }
.gallery-info .gallery-author		{ font-size: 14px; font-style: italic; color: #888; }
.gallery-info .gallery-author:before	{ content: 'autor: ' }
.gallery-info .gallery-description	{ margin-top: 5px; }
 
.gallery_placeholder { padding: 8px 0; display: none; clear: both; }
.gallery_placeholder img { max-width: 900px; }
.article-body .gallery_placeholder { width: 145%; margin-left: -22.5%; max-width: 900px; }

.img-grid-group { background: #fff; margin: 0 -4px; display: flex; align-items: flex-start; }
.group-single { display: block; }
.img-grid-subgroup { display: flex; flex-direction: column; }

.img-grid-item { padding: 4px; display: block; /*border: 4px solid #fff;*/ }
.img-grid-item img { display: block; position: relative; width: 100%;  }

/*************************************
 **** gallery zoom *******************
 ************************************/

.gallery-zoom {
	width: 145%;
	margin: 25px -22.5%;
	text-align: left;
	max-width: 900px;
	clear: both;
	display: block;
}

.gallery-zoom:after {
	content: '';
	float: none;
	clear: both;
	height: 1px;
	display: block;
	margin-bottom: -1px;
	overflow: hidden;
}

.gallery-zoom-item {
	margin: 15px 0;
	position: relative;
}

.gallery-zoom-item:after {
	content: '';
	float: none;
	clear: both;
	height: 1px;
	margin-bottom: -1px;
	overflow: hidden;
	display: block;
}

.gallery-zoom-item img { display: inline-block; cursor: pointer; }

.gallery-zoom-item .item-meta {
	display: inline-block;
	max-width: 260px;
	padding-bottom: 25px;
	position: relative;
	vertical-align: bottom;
	margin-bottom: 20px;
}

.item-meta > * {
	display: block;
}

.item-meta:after {
	content: '';
	display: block;
	width: 26px;
	height: 14px;
	position: absolute;
	bottom: 0;
	left: 0;
	background: url('/img/new/arrows_procne.png') 0 0 no-repeat;
}

.item-meta a {
	color: #da1e48;
	text-transform: uppercase;
	font-weight: bold;
	font-size: 16px;
}

.item-meta .price {
	font-style: italic;
	font-size: 14px;
	margin-bottom: 15px;
}

.item-zoom-right .img-left { display: none; }

.item-zoom-right,
.item-zoom-right img,
.item-zoom-right .item-meta {
	text-align: right;
}

.item-zoom-right .item-meta:after {
	left: auto;
	right: 0;
	background-position: 0 -14px;
}

/*************************************
 **** gallery interview **************
 ************************************/

.gallery-interview {
	margin: 20px auto 0;
}

.gallery-interview img { cursor: pointer; }

.gallery-interview .gallery-inter-item {
	position: relative;
	margin-bottom: 20px;
}

.gallery-inter-item .title {
	position: absolute;
	left: 28px;
	bottom: 28px;
	background: #fff;
	padding: 10px 20px;
	font-weight: bold;
	max-width: 80%;
	max-width: calc(100% - 48px);
	opacity: 0.9;
}
.gallery-inter-item .title.up { top: 28px; bottom: auto; }
.gallery-inter-item .title.right { left: auto; right: 28px; }

.gallery-inter-item .title:after {
	content: '';
	display: block;
	position: absolute;
	bottom: -17px;
	left: 20px;
	width: 0;
	height: 0;
	border-left: 17px solid transparent;
	border-top: 17px solid #fff;
}
.gallery-inter-item .title.up:after { top: -17px; bottom: auto; border-top: 0; border-bottom: 17px solid #fff; }

/*************************************
 **** video placeholder **************
 ************************************/

.video_placeholder:not(.primary) {
 	width: 145%;
 	margin: 25px -22.5%;
 	text-align: center;
 	max-width: 900px;
	clear: both;
}
.video_placeholder.primary { margin: auto; width: 79.06%; }

.video_placeholder img {
	width: 100%;
}

.inserted_video_wrapper {
	position: relative;
	width: 100%;
}
.inserted_video_wrapper > div {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
}

/*************************************
 **** infographic placeholder ********
 ************************************/

.infographic_placeholder {
	width: 145%;
	margin: 25px -22.5%;
	text-align: center;
	max-width: 900px;
	clear: both;
}

/*************************************
 **** overlay ***********************
 ************************************/

.svg-filters {
	height: 0;
}

.blur {
	z-index: -1;
	filter: blur(10px);
	-webkit-filter: blur(10px);
	-moz-filter: blur(10px);
	-o-filter: blur(10px);
	-ms-filter: blur(10px);
	filter: url(#blur);
	filter: progid: DXImageTransform.Microsoft.Blur(PixelRadius='10');
	overflow: hidden;
	position: absolute;
	bottom: 0;
}

.overlay {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	height: 100%;
	background: rgba(0,0,0,0.75);
	z-index: 9000;
}

.media-preview-wrapper {
	height: 100%;
	position: relative;
}

.media-preview {
	text-align: center;

	display: block;
	height: 90%;
	height: calc(100% - 30px);
	margin: 15px auto;
}

/*************************************
 **** video **************************
 ************************************/

.video-view-frame {
	padding: 64px;
	max-width: 900px;
	width: 100%;
}

.video-view-frame .video-frame {
	width: 100%;
	position: relative;
	margin: 0 auto 25px;
}

.video-view-frame .video-meta {
	text-align: left;
	color: #fff;
	font-size: 16px;
	display: block;
}

.video-view-frame .video-meta .title {
	font-weight: bold;
	font-size: 18px;
	margin-bottom: 5px;
}

.video-view-frame .video-meta .author { margin-top: 5px; font-style: italic; font-size: 14px; }
.video-view-frame .video-meta .author:before { content: 'autor: '; }

.video-view-frame .video-meta a,
.video-view-frame .video-meta a:hover { color: #fff; }

/*************************************
 **** gallery ************************
 ************************************/

.gallery-view-frame {
	/*padding: 64px 120px 48px;*/
	width: 100%;
	max-width: 100%;
	padding: 0 112px;
}

.gallery-view-counter {
	text-align: center;
	font-size: 18px;
	color: #fff;
}

.gallery-view-item {
	display: none;
	height: 100%;
	vertical-align: middle;
}

.gallery-view-item-visible {
	display: block;
}

.gallery-view-item-title,
.gallery-view-item-description { display: block; }
.gallery-view-item-author { margin-top: 5px; display: block; font-style: italic; font-size: 14px; }
.gallery-view-item-author:before { content: 'foto: '; }

.gallery-view-item img {
	display: block;
	clear: both;
	max-height: 100%;
	max-width: 100%;
	margin: 0 auto;
}

.gallery-view-item .meta {
	position: absolute;
	bottom: 30px;
	left: 120px;
	right: 120px;
	background: rgba(0,0,0,0.8);
	text-align: left;
	color: #fff;
	font-size: 18px;
	padding: 12px 40px 12px 24px;
	font-style: italic;
}

.gallery-view-item .meta  a,
.gallery-view-item .meta  a:hover { color: #fff; }

.hidden-meta .meta {
	left: auto !important;
	padding: 12px !important;
	border: 1px solid #fff;
	border-radius: 3px;
}

.hidden-meta .meta > div,
.hidden-meta .meta > span {
	display: none !important;
}

.gallery-view .gallery-view-list {
	height: calc(100% - 30px);
}

.media-preview-controls {
	position: absolute;
	opacity: 0.5;
}

.media-preview-controls:hover {
	opacity: 1;
}

.media-preview-controls span {
	display: block;
	width: 24px;
	height: 24px;
	background: url('/img/new/gallery-controlls.png') 0 0 no-repeat;
	position: relative;
}

.button-previous,
.button-next {
	height: 90%;
	padding: 44px;
	min-height: 44px;
	top: 10%;
	right: 0;
}

.button-previous {
	left: 0;
	right: auto;
}

.button-previous span,
.button-next span {
	height: 44px;
	top: 50%;
	margin-top: -22px;
}

.button-next span {
	background-position: right 0;
}

.button-close {
	right: 10px;
	top: 10px;
}

.button-close span {
	background-position: -24px -10px;
}

.button-description {
	position: absolute;
	right: 5px;
	top: 5px;
	height: 24px;
	width: 24px;
	font-size: 34px;
	text-align: center;
	color: #fafafa;
	font-weight: bold;
	font-style: normal;
	cursor: pointer;
}

.button-description:hover {
	text-decoration: none;
	color: #fff;
}

.button-description:before {
	content: '×';
	top: -13px;
	display: block;
	position: relative;
}

.hidden-meta .button-description {
	top: 0;
	right: 0;
	font-size: 20px;
}

.hidden-meta .button-description::before {
	content: 'i';
	top: -1px;
}

/*************************************
 **** autogallery ********************
 ************************************/

.added-into-autogallery,
.infographic_placeholder img	{ cursor: pointer; }

/*************************************
 **** infographic ********************
 ************************************/

.infographic-view-frame {
	padding: 0 48px;
	max-width: 100%;
}

.infographic-view-frame .infographic-frame {
	overflow: auto;
	height: 100%;
}

.infographic-view-frame .infographic-meta {
	position: absolute;
	bottom: 15px;
	left: 90px;
	right: 90px;
	background: rgba(0,0,0,0.5);
	padding: 6px 10px;
}

.infographic-view-frame .infographic-meta .author,
.infographic-view-frame .infographic-meta .description,
.infographic-view-frame .infographic-meta .title {
	text-align: left;
	color: #fff;
	font-size: 16px;
	display: block;
}

.infographic-view-frame .infographic-meta .title { font-weight: bold; font-size: 18px; }
.infographic-view-frame .infographic-meta .description { margin-top: 5px; }

.infographic-view-frame .infographic-meta .author { margin-top: 5px; font-style: italic; font-size: 14px; }
.infographic-view-frame .infographic-meta .author:before { content: 'autor: '; }

.infographic-view-frame .infographic-meta a,
.infographic-view-frame .infographic-meta a:hover { color: #fff; }



@media only screen and (max-width: 767px) {
	.gallery-zoom { width: 100%; margin: 25px 0; max-width: 100%; }
	.item-zoom-right .img-left { display: inline-block; }
	.item-meta:after,
	.item-zoom-right .img-right { display: none; }
	
	.item-zoom-right,
	.item-zoom-right img,
	.item-zoom-right .item-meta { text-align: left; }
	
	.media-preview-controls span	{ width: 18px; height: 18px; background-size: 54px 33px; }
	.button-close span		{ background-position: -18px -8px; }
	.button-close			{ top: 2px; right: 8px; }
	.button-previous span,
	.button-next span		{  height: 33px; }

	
	.gallery-view-frame { padding: 0 15px; }
	.gallery-view-frame .gallery-view-item .meta { left: 15px; right: 15px; padding: 8px 32px 8px 12px; font-size: 14px; }
	.gallery-view-frame .button-previous, .gallery-view-frame .button-next { padding: 22px; }
	
	.video-view-frame { padding: 0 36px 0 15px; }
	.infographic-view-frame { padding: 0 36px 0 15px; }
	
	.video-view-frame .video-meta .title,
	.infographic-view-frame .infographic-meta .title { font-size: 16px; }
	
	.video-view-frame .video-meta,
	.infographic-view-frame .infographic-meta .description { font-size: 14px; }

	.gallery-view-item-author,
	.video-view-frame .video-meta .author,
	.infographic-view-frame .infographic-meta .author { font-size: 12px; }
}