@-webkit-keyframes add-overflow-visible {
	0% { overflow: hidden; }
	100% { overflow: visible; }
}

@keyframes add-overflow-hidden {
	0% { overflow: visible; }
	100% { overflow: hidden; }
}

/**
 * (en) Screen layout for NAME
 * (de) Bildschirmlayout für NAME
 *
 * @copyright			Copyright 2015, crossbase mediasolution GmbH
 * @version				1.0
 */

.item-viewport-main-wrapper-shift {
	margin: 0;
}

.item-viewport-main-wrapper,
.item-viewport-main-wrapper-no-filter{
	position: relative;
	padding: 0;
	/*overflow: hidden;*/
}

.item-viewport-main-wrapper.filter-is-visible {
	/*-webkit-animation: 1s add-overflow-visible;
            animation: 1s add-overflow-visible;*/
	-webkit-animation-fill-mode:forwards; /*Chrome 16+, Safari 4+*/
	-moz-animation-fill-mode:forwards; /*FF 5+*/
	-ms-animation-fill-mode:forwards; /*IE 10+*/
	animation-fill-mode:forwards; /*when the spec is finished*/
	overflow: visible;
}

.item-viewport-main-content {
	position: relative;
}

.item-viewport-main-content .item-viewport-gallery > ul li {
	padding: 0;
	margin: 0;
}

.item-viewport-main-content:after {
	content: "";
	display: table;
	clear: both;
}

.half-padding .item-viewport-main-content .box-bottom-100,
.half-padding .item-viewport-main-content .grid-element {
	margin: 0 0 12px 0;
}

.item-viewport-main-content .box-bottom-100 {
	background: #fff;
}

.ym-grid-col-background .item-viewport-main-content .box-bottom-100 {
	background: #fff;
}

.item-viewport-main-content #filter .box-bottom-100 {
	background: transparent;
}

/*------------------------------------------------------------------------------------------------------*/
/* (en) Format Current Filters with dynamiv deselection */
/* (de) Formatierung der ausgewählten Filter mit dynamischer Deselektion */
/*------------------------------------------------------------------------------------------------------*/

/*.item-viewport-filter-trigger .button.sliders-icon {
    position: absolute;
    top: 62px;
    z-index: 99;
}*/

.filter-item-wrapper {
	margin: 0 -12px 0 0;
}

.filter-item {
	margin: 0 12px 12px 0;
	float: left;
	background: #f1f1f1;
	padding: 0 12px 0 0;
}

.filter-item.close-symbols {
	padding: 0;
}

.filter-item.close-symbols .filter-content {
	padding: 4px 12px;
}

.filter-item.close-symbols .filter-title button {
	font-size: 28px;
}

.filter-item.close-symbols .filter-content .filter-content-label {
	padding: 0;
	line-height: 24px;
}

.filter-item.close-symbols .filter-content button {
	font-size: 22px;
	line-height: 24px;
	height: 24px;
	vertical-align: bottom;
	padding: 0 6px;
	-webkit-transition: all 0.3s ease;
	transition: all 0.3s ease;
}

.filter-item.close-symbols .filter-content button:hover {
	background: #cc1c14;
	color: #fff;
}

.filter-item::before,
.filter-item::after {
	display: table;
	content: '';
}

.filter-item::after {
	clear: both;
}


.filter-item .float-left {
	margin: 0;
}

.filter-title {
	position: relative;
	background: #1d374a;
	color: #fff;
}

.filter-title-label {
	line-height: 32px;
	padding: 0 4px 0 8px;
}

.filter-content {
	padding: 4px 0 4px 12px;
}

.filter-content-label {
	padding: 0 0 0 26px;
}

@media only screen and (max-width: 600px) {

	/*.item-viewport-filter-trigger .button.sliders-icon {
		position: relative;
		top: auto;
    left: 0;
    top: 150px;
	}*/

	.filter-item {
		float: none;
		display: block;
		padding: 0;
	}

	.filter-title.float-left {
		float: none;
		display: block;
		border-bottom: 1px solid #ededed;
	}

	.filter-title.float-left .button{
		position: absolute;
		right: 0;
		top: 0;
	}

}

/*------------------------------------------------------------------------------------------------------*/
/* (en) Format Toolbar with Filter-Toggle and Paging*/
/* (de) Formatierung der Toolbar mit Filter-Toggle und Paging
/*------------------------------------------------------------------------------------------------------*/

.item-viewport-toolbar-wrapper {
	z-index: 1;
	background: #fff;
	padding: 0;
}

.ym-grid-col-background .item-viewport-toolbar-wrapper {
	background: #fff;
}

.item-viewport-toolbar-wrapper:after {
	content: "";
	display: table;
	clear: both;
}

.item-viewport-toolbar {
	width: 100%;
	margin: 0;
}

@media only screen and (max-width: 670px) {

	.half-padding .item-viewport-toolbar-wrapper .boxgroup-wrapper {
		margin: 0;
	}

	.item-viewport-toolbar .linearize-level-2 > [class*=ym-g][class*=ym-g] {
		width: auto;
		float: left;
		margin: 0;
	}

	.item-viewport-toolbar .linearize-level-2 > [class*=ym-g][class*=ym-g] .ym-gbox {
		margin: 0;
		float: none;
	}

	.item-viewport-toolbar .linearize-level-2 > [class*=ym-g][class*=ym-g] .ym-gbox .flow-inline {
		margin: 0;
	}

}

@media only screen and (max-width: 600px) {

	.item-viewport-toolbar .linearize-level-2 > [class*=ym-g][class*=ym-g] {
		float: none;
		width: 100%;
	}

	.item-viewport-toolbar .linearize-level-2 > [class*=ym-g][class*=ym-g] .ym-gbox .flow-inline {
		margin: 0;
	}



	.linearize-level-2 .flow-inline, .linearize-level-2 .flow-inline.flow-right {
		text-align: center;
	}

}

@media only screen and (max-width: 560px) {

	.item-viewport-toolbar-wrapper {
		padding: 0;
	}

	/*.item-viewport-filter-trigger .button.sliders-icon {
    left: 0;
	}*/


}

/*------------------------------------------------------------------------------------------------------*/
/* (en) Format Gallery Area */
/* (de) Formatierung des Galeriebereichs
/*------------------------------------------------------------------------------------------------------*/

.item-viewport-gallery {
	padding: 0;
	margin: -24px -24px 24px -24px;
	-webkit-transition: width 0.3s, margin ease 0.3s;
	transition: width 0.3s, margin ease 0.3s;
}

.item-viewport-gallery-no-filter {
	padding: 0;
	margin: 0 -24px 24px -24px;
	-webkit-transition: width 0.3s, margin ease 0.3s;
	transition: width 0.3s, margin ease 0.3s;
}

.item-viewport-gallery.filter-is-visible {
	width: auto;
	margin: -24px -24px 24px 300px;
}

.no-tiles-wrapper-01 {
	display: table;
}

.no-tiles-wrapper-02 {
	display: table;
	width: 100%;
	table-layout: fixed;
}

.no-tiles-content {
	padding: 0 24px;
	margin: 0;
}

.item-viewport-gallery > ul {
	text-align: justify;
	text-justify: distribute;
	font-size: 0;
	line-height: 0;
	margin: 0;
}

.ocat-index.tiles-fixed .item-viewport-gallery > ul {
	text-align: center;
}

.item-viewport-gallery > ul:after {
	content: "";
	display: table;
	clear: both;
}

.item-viewport-gallery > ul > li {
	display: inline;
	margin: 0;
	height: auto;
	font-size: 0;
	line-height: 0;
	background: none;
}

.item-viewport-gallery .item-viewport-tile {
	display: inline-block;
	vertical-align: bottom;
	width: 16.66%;
	height: 330px;
	position: relative;
}

.ocat-index .item-viewport-gallery .item-viewport-tile {
	/*height: 330px;*/
	height: auto;
}

.item-viewport-gallery .item-viewport-tile.viewport-width {
	display: block;
	width: 100%;
	min-height: 0;
	height: auto;
	margin: 0;
}

.item-viewport-gallery .item-viewport-tile,
.item-viewport-gallery .item-viewport-tile img {
	/* Force Hardware Acceleration */
	-webkit-transform: translateZ(0);
	transform: translateZ(0);
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	-webkit-transition: all 0.3s ease;
	transition: all 0.3s ease;
}

.item-viewport-gallery .item-viewport-tile img {
	max-height: 200px;
}

.item-viewport-gallery.narrow .item-viewport-tile {
	width: 25%;
}

.ocat-index.tiles-fixed .item-viewport-gallery.narrow .item-viewport-tile {
	width: 25%;
	min-width: 282px;
	max-width: 282px;
}

.ocat-index .item-viewport-gallery.narrow .item-viewport-tile {
	width: 25%;
}

.item-viewport-gallery .item-viewport-tile .item-viewport-tile-content {
	display: block;
	overflow: hidden;
	vertical-align: bottom;
	margin: 24px;
	height: 282px;
	height: auto;
	position: relative;
	background: #fff;
	text-align: center;
	font-size: 12px;
	line-height: 24px;
	transition: all ease 0.3s;
}

.item-viewport-gallery .item-viewport-tile .item-viewport-tile-content:hover {
	box-shadow: 0 0 6px rgba(0, 0, 0, 0.2);
}

.ocat-index .item-viewport-gallery .item-viewport-tile .item-viewport-tile-content {
	margin: 24px;
	background: #b3c2c8;
	height: auto;
	font-size: 12px;
}

.ocat-index .item-viewport-gallery .item-viewport-tile .item-viewport-tile-content .ratio-container {
	height: 0;
	margin: 0;
	padding-bottom: 100%;
	position: relative;
	box-sizing: border-box;
}

.ocat-index .item-viewport-gallery .item-viewport-tile .item-viewport-tile-content .ratio-container .ratio-container-content  {
	height: 100%;
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;
	overflow: hidden;
}

.item-viewport-gallery .item-viewport-tile.viewport-width > * {
	min-height: 0;
	height: auto;
	margin: 6px 6px 12px 6px;
}

.item-viewport-gallery.filter-is-visible .item-viewport-tile {
	width: 25%;
}

.item-viewport-gallery.narrow.filter-is-visible .item-viewport-tile {
	width: 33.33%;
}

.item-viewport-gallery.narrow .item-viewport-tile.viewport-width,
.item-viewport-gallery.filter-is-visible .item-viewport-tile.viewport-width,
.item-viewport-gallery.narrow.filter-is-visible .item-viewport-tile.viewport-width {
	width: 100%;
}

.item-viewport-gallery .item-viewport-tile.gap {
	display: inline-block;
	opacity: 0;
	height: 0;
	margin: 0;
}

.item-viewport-gallery .item-viewport-tile .content-wrapper {
	padding: 12px 12px 0 12px;
	text-align: left;
}

.item-viewport-gallery .item-viewport-tile .image-wrapper {
	margin: 0;
	text-align: center;
	display: block;
}

.item-viewport-gallery .item-viewport-tile .image-wrapper a {
	display: block;
	position: relative;
	margin: 12px 12px 0 12px;
	line-height: 200px;
}

.ocat-index .item-viewport-gallery .item-viewport-tile .image-wrapper a {
	height: 100%;
}


.item-viewport-gallery .item-viewport-tile .image-wrapper .tile-nav {
	line-height: 282px;
	margin: 0;
}

.item-viewport-gallery .item-viewport-tile.viewport-width .image-wrapper .tile-nav {
	line-height: inherit;
	margin: 0;
}

.item-viewport-gallery .item-viewport-tile .image-wrapper a img {
	max-height: 200px;
	border: none;
	vertical-align: middle;
}

.item-viewport-gallery .item-viewport-tile .image-wrapper .tile-nav img {
	vertical-align: top;
	max-height: 282px;
	padding: 12px;
}

.ocat-index .item-viewport-gallery .item-viewport-tile .image-wrapper .tile-nav img {
	padding: 0;
}

.item-viewport-gallery .item-viewport-tile .image-wrapper .tile-nav .select2-style-button-100-center button,
.item-viewport-gallery .item-viewport-tile .image-wrapper .tile-nav .select2-style-button-100-center .button {
	background: #ffffff;
	border: 1px solid #ffffff;
	color: #1d374a;
	margin: 12px 0 0 0;
}

.item-viewport-gallery .item-viewport-tile .image-wrapper .tile-nav > span.item-viewport-tile-hover,
.item-viewport-gallery .item-viewport-tile .image-wrapper .tile-nav > span.item-viewport-tile-hover > span,
.item-viewport-gallery .item-viewport-tile .image-wrapper .tile-nav > span.item-viewport-tile-hover > span > span,
.item-viewport-gallery .item-viewport-tile .image-wrapper .tile-nav > span.item-viewport-tile-hover > span > span > span {
	display: block;
	transition: min-height 0.5s ease, transform 0.5s ease, background 0.5s ease ;
	min-height: 24px;
	text-align: center;
}

.ocat-index .item-viewport-gallery .item-viewport-tile .image-wrapper .tile-nav > span.item-viewport-tile-hover,
.ocat-index .item-viewport-gallery .item-viewport-tile .image-wrapper .tile-nav > span.item-viewport-tile-hover > span,
.ocat-index .item-viewport-gallery .item-viewport-tile .image-wrapper .tile-nav > span.item-viewport-tile-hover > span > span,
.ocat-index .item-viewport-gallery .item-viewport-tile .image-wrapper .tile-nav > span.item-viewport-tile-hover > span > span > span {
	text-align: left;
	font-family: 'Univers LT Bold';
}

.item-viewport-gallery .item-viewport-tile .image-wrapper .tile-nav > span.item-viewport-tile-hover > span > span > span + span {
	display: none;
}

.item-viewport-gallery .item-viewport-tile .image-wrapper .tile-nav > span.item-viewport-tile-hover {
	position: absolute;
	bottom: 0;
	line-height: 18px;
	/*color: #fff;
    background: rgba(112, 112, 112, 1);*/
	color: #1d374a;
	width: 100%;
}

.item-viewport-gallery .item-viewport-tile .image-wrapper .tile-nav > span.item-viewport-tile-hover > span,
.item-viewport-gallery .item-viewport-tile .image-wrapper .tile-nav > span.item-viewport-tile-hover > span > span {
	/*position: relative;*/
}

.item-viewport-gallery .item-viewport-tile .image-wrapper .tile-nav > span.item-viewport-tile-hover > span > span {
	position: absolute;
	top: inherit;
	bottom: 0;
	left: 0;
	transform: translateY(0);
	width: 100%;
}

.item-viewport-gallery .item-viewport-tile .image-wrapper .tile-nav > span.item-viewport-tile-hover > span > span > span {
	padding: 12px;
}

.item-viewport-gallery .item-viewport-tile .image-wrapper.tile-nav-hover .tile-nav:hover > span.item-viewport-tile-hover,
.item-viewport-gallery .item-viewport-tile .image-wrapper .tile-nav.tile-active > span.item-viewport-tile-hover {
	background: rgba(29, 55, 74, .95);
	color: #fff;
}

.item-viewport-gallery .item-viewport-tile .image-wrapper.tile-nav-hover .tile-nav:hover > span.item-viewport-tile-hover,
.item-viewport-gallery .item-viewport-tile .image-wrapper.tile-nav-hover .tile-nav:hover > span.item-viewport-tile-hover > span,
.item-viewport-gallery .item-viewport-tile .image-wrapper .tile-nav.tile-active > span.item-viewport-tile-hover,
.item-viewport-gallery .item-viewport-tile .image-wrapper .tile-nav.tile-active > span.item-viewport-tile-hover > span {
	min-height: 282px;
}

.item-viewport-gallery .item-viewport-tile .image-wrapper .tile-nav.tile-active > span.item-viewport-tile-hover::after {
	font-family: 'Font Awesome 5 Free';
	font-weight: 900;
	line-height: 20px;
	font-size: 24px;
	position: absolute;
	top: 8px;
	right: 8px;
	content: '\f14a';
}

.ocat-index .item-viewport-gallery .item-viewport-tile .image-wrapper.tile-nav-hover .tile-nav:hover > span.item-viewport-tile-hover,
.ocat-index .item-viewport-gallery .item-viewport-tile .image-wrapper.tile-nav-hover .tile-nav:hover > span.item-viewport-tile-hover > span,
.ocat-index .item-viewport-gallery .item-viewport-tile .image-wrapper .tile-nav.tile-active > span.item-viewport-tile-hover,
.ocat-index .item-viewport-gallery .item-viewport-tile .image-wrapper .tile-nav.tile-active > span.item-viewport-tile-hover > span {
	min-height: 100%;
}

.item-viewport-gallery .item-viewport-tile .image-wrapper.tile-nav-hover .tile-nav:hover > span.item-viewport-tile-hover > span > span,
.item-viewport-gallery .item-viewport-tile .image-wrapper .tile-nav.tile-active > span.item-viewport-tile-hover > span > span {
	transform: translateY(-50%);
	top: 50%;
	bottom: inherit;
}

.item-viewport-gallery .item-viewport-tile .image-wrapper.tile-nav-hover .tile-nav:hover > span.item-viewport-tile-hover > span > span > span,
.item-viewport-gallery .item-viewport-tile .image-wrapper .tile-nav.tile-active > span.item-viewport-tile-hover > span > span > span {
	text-align: center;
	font-family: 'Univers LT Bold';
}

.item-viewport-gallery .item-viewport-tile .image-wrapper.tile-nav-hover .tile-nav:hover > span.item-viewport-tile-hover > span > span > span + span,
.item-viewport-gallery .item-viewport-tile .image-wrapper .tile-nav.tile-active > span.item-viewport-tile-hover > span > span > span + span {
	display: block;
}

.item-viewport-gallery .item-viewport-tile .image-wrapper.tile-nav-hover .tile-nav:hover > span.item-viewport-tile-hover > span > span > span,
.item-viewport-gallery .item-viewport-tile .image-wrapper .tile-nav.tile-active > span.item-viewport-tile-hover > span > span > span {
	display: none;
}


.item-viewport-gallery .item-viewport-tile.viewport-width .image-wrapper .tile-nav .boxgroup-wrapper {
	padding: 12px;
}

.item-viewport-gallery .item-viewport-tile.viewport-width .image-wrapper .tile-nav .boxgroup-wrapper,
.item-viewport-gallery .item-viewport-tile.viewport-width .image-wrapper .tile-nav .ym-grid span {
	display: block;
	color: #333;
}

.item-viewport-gallery .item-viewport-tile.viewport-width .image-wrapper .tile-nav .ym-grid [class*=ym-g] + [class*=ym-g] {
	text-align: left;
}

.item-viewport-gallery .item-viewport-tile.viewport-width .image-wrapper .tile-nav .tile-head {
	font-family: 'Univers LT Bold';
	font-size: 17px;
	line-height: 22px;
	font-weight: normal;
	margin: 0 0 12px 0;
	position: relative;
}

.item-viewport-gallery .item-viewport-tile.viewport-width .image-wrapper .tile-nav .tile-info {
	margin: 0 0 12px 0;
}

.item-viewport-gallery .item-viewport-tile.viewport-width .image-wrapper.tile-nav-hover .tile-nav:hover > span.item-viewport-tile-hover,
.item-viewport-gallery .item-viewport-tile.viewport-width .image-wrapper.tile-nav-hover .tile-nav:hover > span.item-viewport-tile-hover > span {
	min-height: 100%;
}

.item-viewport-gallery .item-viewport-tile.viewport-width .image-wrapper.tile-nav-hover .tile-nav:hover > span.item-viewport-tile-hover {
	/*background: rgba(0, 0, 0, .1);
    color: #fff;*/
}

.item-viewport-gallery .item-viewport-tile .nav-forward {
	line-height: 264px;
}

.item-viewport-gallery .item-viewport-tile .nav-forward [class*="icon"] {
	display: inline-block;
	line-height: 10px;
}

.item-viewport-gallery .item-viewport-tile .nav-forward [class*="icon"]::before {
	font-size: 120px;
	line-height: 0;
	vertical-align: top;
}

.item-viewport-gallery .item-viewport-tile .add-to-watchlist {
	position: absolute;
	right: 32px;
	bottom: 10px;
	z-index: 1;
}

.item-viewport-gallery .item-viewport-tile .paper-clip-icon:before {
	margin-right: -4px;
}

.item-viewport-gallery .item-viewport-tile .add-to-watchlist .checkbox {
	display: inline-block;
	position: static;
}

.item-viewport-gallery .item-viewport-tile .add-to-watchlist .paper-clip-icon:before {
	font-size: 18px;
}

.item-viewport-gallery .item-viewport-tile .media-element-info {
	display: block;
	position: absolute;
	bottom: 8px;
	max-width: 100%;
}

.item-viewport-gallery .item-viewport-tile .media-element-info > * {
	display: block;
	text-align: left;
	margin: 0 12px 2px 12px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.item-viewport-gallery .item-viewport-tile .image-wrapper {
	overflow: hidden;
	height: 100%;
}

.item-viewport-gallery .item-viewport-tile.hover-controls {
	height: 236px;
}

.item-viewport-gallery .item-viewport-tile.hover-controls .item-viewport-tile-content {
	height: 224px;
}

.item-viewport-gallery .item-viewport-tile.hover-controls .image-wrapper > span {
	display: block;
	position: relative;
	margin: 12px 12px 0 12px;
	line-height: 200px;
}

.item-viewport-gallery .item-viewport-tile.hover-controls .image-wrapper > span > img {
	max-height: 200px;
	border: none;
}

.item-viewport-gallery .item-viewport-tile.hover-controls .image-wrapper > span > .paper-clip-icon {
	position: absolute;
	right: 0;
	top: 0;
	line-height: 24px;
	display: block;
	height: 24px;
	width: 24px;
	background: #e5e5e5;
}

.item-viewport-gallery .item-viewport-tile.hover-controls .image-wrapper .img-controls-wrapper {
	height: 200px;
	width: 100%;
	display: block;
	bottom:-80px;
	left: 0;
	-webkit-transition: bottom .3s ease-in-out;
	transition: bottom .3s ease-in-out;
	position: absolute;
}

.item-viewport-gallery .item-viewport-tile.hover-controls .image-wrapper .img-controls {
	margin: 0 12px;
	background: rgba(255, 255, 255, 0.6);
	opacity: 0;
	-webkit-transition: height .3s ease-in-out;
	transition: height .3s ease-in-out;
}

.item-viewport-gallery .item-viewport-tile.hover-controls .image-wrapper .img-controls a,
.item-viewport-gallery .item-viewport-tile.hover-controls .image-wrapper .img-controls .ym-gr > span {
	display: block;
	line-height: 40px;
	margin: 0;
	background: rgba(255,255,255, 0.4);
}

.item-viewport-gallery .item-viewport-tile.hover-controls .image-wrapper .img-controls .ym-grid {
	width: 100.2%;
}


.item-viewport-gallery .item-viewport-tile.hover-controls .image-wrapper .img-controls .checkbox {
	display: inline;
	padding-right: 18px;
}

.item-viewport-gallery .item-viewport-tile.hover-controls .image-wrapper .img-controls label {
	top: 0;
}

.item-viewport-gallery .item-viewport-tile.hover-controls .image-wrapper:hover .img-controls-wrapper {
	height: 40px;
	bottom: 0;
}

.item-viewport-gallery .item-viewport-tile.hover-controls .image-wrapper:hover .img-controls {
	opacity: 1;
}


.item-viewport-gallery .item-viewport-tile.hover-controls .image-wrapper:hover .magnify:before {
	color: rgba(255, 255, 255, 0);
	text-shadow: 0px 0px 8px rgba(0, 0, 0, 0);
}

@media only screen and (max-width: 1200px) {

	.item-viewport-gallery .item-viewport-tile {
		width: 20%;
	}

	.item-viewport-gallery.narrow .item-viewport-tile {
		width: 25%;
	}

	.item-viewport-gallery.filter-is-visible .item-viewport-tile {
		width: 25%;
	}

	.item-viewport-gallery.narrow.filter-is-visible .item-viewport-tile {
		width: 33%;
	}

}

@media only screen and (max-width: 990px) {

	.item-viewport-gallery .item-viewport-tile,
	.item-viewport-gallery.narrow .item-viewport-tile {
		width: 25%;
	}

	.item-viewport-gallery.filter-is-visible .item-viewport-tile,
	.item-viewport-gallery.narrow.filter-is-visible .item-viewport-tile,
	.ocat-index .item-viewport-gallery.narrow .item-viewport-tile {
		width: 33.33%;
	}

}

@media only screen and (max-width: 960px) {

	.no-tiles .item-viewport-gallery.filter-is-visible {
		margin: 0 -6px 6px -6px;
	}

	.item-viewport-gallery.filter-is-visible .item-viewport-tile,
	.item-viewport-gallery.narrow.filter-is-visible .item-viewport-tile,
	.ocat-index .item-viewport-gallery.narrow .item-viewport-tile {
		width: 33.33%;
	}

	.item-viewport-gallery.filter-is-visible .item-viewport-tile,
	.item-viewport-gallery.narrow.filter-is-visible .item-viewport-tile {
		width: 50%;
	}


}

@media only screen and (max-width: 800px) {

	.item-viewport-gallery .item-viewport-tile,
	.item-viewport-gallery.narrow .item-viewport-tile,
	.ocat-index .item-viewport-gallery.narrow .item-viewport-tile {
		width: 50.00%;
	}

	.item-viewport-gallery.filter-is-visible .item-viewport-tile,
	.item-viewport-gallery.narrow.filter-is-visible .item-viewport-tile {
		width: 100%;
	}

}


@media only screen and (max-width: 850px) {

	.item-viewport-gallery {
		margin: 0 -12px 24px -12px;
	}

	.ocat-index .item-viewport-gallery .item-viewport-tile .item-viewport-tile-content {
		margin: 12px;
	}

	.ocat-index.tiles-fixed .item-viewport-gallery.narrow .item-viewport-tile {
		width: 25%;
		min-width: 258px;
		max-width: 258px;
	}


}



@media only screen and (max-width: 560px) {

	.item-viewport-gallery .item-viewport-tile,
	.item-viewport-gallery.filter-is-visible .item-viewport-tile,
	.item-viewport-gallery.narrow .item-viewport-tile,
	.item-viewport-gallery.narrow.filter-is-visible .item-viewport-tile,
	.ocat-index .item-viewport-gallery.narrow .item-viewport-tile {
		width: 50%;
	}

	.item-viewport-gallery.filter-is-visible {
		margin: 0 -6px 6px -6px;
	}

}

@media only screen and (max-width: 480px) {

	.item-viewport-gallery .item-viewport-tile,
	.item-viewport-gallery.filter-is-visible .item-viewport-tile,
	.item-viewport-gallery.narrow .item-viewport-tile,
	.item-viewport-gallery.narrow.filter-is-visible .item-viewport-tile,
	.ocat-index .item-viewport-gallery.narrow .item-viewport-tile {
		width: 100%;
		text-align: left;
	}

}

/*------------------------------------------------------------------------------------------------------*/
/* (en) Format Side Filter */
/* (de) Formatierung des Seitenfilters */
/*------------------------------------------------------------------------------------------------------*/

.item-viewport-filter-wrapper {
	padding: 12px 12px 0 12px;
	width: 300px;
	box-sizing: border-box;
}

.item-viewport-filter {
	position: absolute;
	z-index: 1;
	display: block;
	width: 0;
	height: auto;
	background: #eff0f0;
	margin: 0 12px 0 0;
	/* Force Hardware Acceleration */
	-webkit-transform: translateZ(0);
	transform: translateZ(0);
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	/* Animate Filter Visibility */
	/**-webkit-transform: translateX(-320px);
       -ms-transform: translateX(-320px);
            transform: translateX(-320px);
        -webkit-transition: transform 0.3s linear;
        -o-transition: transform 0.3s linear;
        transition: transform 0.3s linear;*/
	-webkit-transition: width 0.2s linear;
	-o-transition: width 0.2s linear;
	transition: width 0.2s linear;
	overflow: hidden;
}

.half-padding .item-viewport-filter {
	background: #eff0f0;
}

.item-viewport-filter.filter-is-visible {
	position: relative;
	float: left;
	margin: 0;
	width: 300px;
	height: auto;
	/*-webkit-transform: translateX(0);
        transform: translateX(0);
        webkit-transition: all 0.3s linear;
        transition: all 0.3s linear;*/
}

.item-viewport-filter::before {
	/* top colored bar */
	/*content: '';
    position: absolute;
    top: 0;
    left: 0;
    height: 32px;
    width: 100%;
    background: #1d374a;
    z-index: 2;*/
}

.item-viewport-filter .item-viewport-close {
	position: absolute;
	top: 0;
	right: 0;
	height: 32px;
	line-height: 32px;
	width: 42px;
	color: #fff;
	text-align: center;
	font-size: 22px;
	opacity: 0;
	-webkit-transition: opacity 0.3s;
	transition: opacity 0.3s;
	z-index: 4;
}

.item-viewport-filter .item-viewport-head {
	position: absolute;
	top: 0;
	left: 12px;
	height: 32px;
	line-height: 32px;
	color: #fff;
	opacity: 0;
	-webkit-transition: opacity 0.3s;
	transition: opacity 0.3s;
	z-index: 3;
	width: 300px;
}

.item-viewport-filter.filter-is-visible .item-viewport-close,
.item-viewport-filter.filter-is-visible .item-viewport-head {
	opacity: 1;
}

.item-viewport-filter #nav-local.nav-item-viewport-filter {
	margin: 0;
}

.item-viewport-filter #nav-local.nav-item-viewport-filter ul {
	background: inherit;
}


@media only screen and (max-width: 980px)
{

	.item-viewport-filter #nav-local.nav-item-viewport-filter {
		display: block;
	}

}


@media only screen and (max-width: 960px) {

	.no-tiles .item-viewport-filter {
		-webkit-transition: width 0s linear;
		-o-transition: width 0s linear;
		transition: width 0s linear;
	}

	.no-tiles .item-viewport-filter.filter-is-visible {
		width: 100%;
		float: none;
		margin: 12px 0 -6px 0;
		-webkit-transition: width 0s linear;
		-o-transition: width 0s linear;
		transition: width 0s linear;
	}

	.no-tiles .item-viewport-filter-wrapper {
		padding: 44px 12px 0 12px;
		width: 100%;
	}

}


@media only screen and (max-width: 560px) {

	.item-viewport-filter {
		-webkit-transition: width 0s linear;
		-o-transition: width 0s linear;
		transition: width 0s linear;
	}

	.item-viewport-filter.filter-is-visible {
		width: 100%;
		float: none;
		margin: 18px 0 -6px 0;
		-webkit-transition: width 0s linear;
		-o-transition: width 0s linear;
		transition: width 0s linear;
	}

	.item-viewport-filter-wrapper {
		padding: 44px 12px 0 12px;
		width: 100%;
	}

}

/*------------------------------------------------------------------------------------------------------*/
/* (en) Format Image in Detail View */
/* (de)
/*------------------------------------------------------------------------------------------------------*/

.media-detail .image-wrapper {
	text-align: center;
	display: block;
	position: relative;
	margin: 12px 0;
}

.media-detail  .image-wrapper  img {
	max-height: 400px;
	border: none;
	vertical-align: middle;
}

.media-detail  .image-wrapper .button.angel-left-icon {
	position: absolute;
	left: 0;
	top: 50%;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	z-index: 99;
}

.media-detail  .image-wrapper .button.angel-right-icon {
	position: absolute;
	right: 0;
	top: 50%;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	z-index: 99;
}

.media-cart  .image-wrapper {
	display: block;
	position: relative;
	text-align: center;
}

.media-cart  .image-wrapper img {
	max-height: 200px;
	border: none;
	vertical-align: middle;
}