.content .template * + .listing {

	margin-top: 50px;

}



.content .template .listing:first-child {

	margin-top: 0 !important;

}

.content .template .listing:last-child {

	margin-bottom: 0 !important;

}





/************************************/

/********** LISTING HEADER **********/

/************************************/



.listing .header {

	margin-bottom: 25px;

	position: relative;

}

.listing .header h2,

.listing .header .h2 {

	line-height: 1.5;

	margin: 0;

	flex: 1;

	font-size: 36px;

	text-transform: uppercase;

	font-family: var(--font-family-3); 

	font-weight: bold;

}

.listing .link {

    margin-top: 10px;

}



.listing hr {

	margin: 0;

	border-top: 1px solid #e0dedd;

}



.template .listing .accordion h3, .template .listing .accordion .h3,

.template .listing .accordion h2, .template .listing .accordion .h2,

.template .listing .file h3, .template .listing .file .h3,

.template .listing .file h2, .template .listing .file .h2,

.template .listing .item h3, .template .listing .item .h3,

.template .listing .item h2, .template .listing .item .h2 {

	font-size: 16px;

	font-weight: 500;

	color: var(--black);

	margin: 0;

	transition: var(--transition);

	-webkit-transition: var(--transition);

	font-size: 18px;

	font-weight: bold;

	font-family: 'Apex New';

	line-height: 1.2;

	text-transform: initial;

}



.listing .load-more {

	margin-top: 50px;

	left: 50%;

	transform: translateX(-50%);

}

.blog .listing .items > *:not(hr):not(.button):first-child {

	margin-top: 0;

}

.blog .listing .items > *:not(hr):not(.button) {

	padding: 0;

	background: transparent;

	margin: 40px 0;

}

.blog .listing .items .article {

	background: white;

}

.blog .listing .items .article > a {

	display: block;

}

.blog .listing .items .article > a.img img {

	transform: scale(1);

	transition: all 0.4s ease;

	margin: 0;

}

.blog .listing .items .article > a.img {

	margin-bottom: 20px;

	overflow: hidden;

}

.blog .listing .items .article > a.img:hover img {

	transform: scale(1.1);

}

.blog .listing .items .article > *:not(.img) {

	padding: 0 20px;

}

.blog .listing .items .article > a.title > * {

	margin-bottom: 0;

}

.blog .listing .items .article > a.title:hover {

	color: var(--green);

}

.blog .listing .items .article > a.title + div {

	font-family: var(--font-family-1);

	font-size: 12px;

}

.blog .listing .items .article > p {

	font-family: var(--font-family-2);

}

.blog .listing .items .article > a.title + div > .date {

	font-style: italic;

	font-weight: bold;

	margin-right: 10px;

} 

.blog .listing .items .article > a.title + div > .date + span {

	color: var(--green);

}

.blog .listing .items .article > a.title + div > .date + span a {

	transition: var(--transition);

}

.blog .listing .items .article > a.title + div > .date + span a:hover {

	color: var(--darkgrey);

}

.blog .listing .items .article > a.title {

	margin-bottom: 15px;

	transition: var(--transition);

}

.recipes .listing .items > *:not(hr):not(.button) {

	background: transparent;

}

.listing .items > *:not(hr):not(.button) {

	position: relative;

	margin: 5px 0;

	background-color: rgba(255,255,255,0.3);

	padding: 20px;

}

.template .listing .items > .accordion {

	padding-right: 45px;

}

.template .listing .items .button {

	color: var(--green);

}



.template .listing .items .file[data-file="pdf"] .button {

	color: var(--red);

}

.template .listing .items .file[data-file="doc"] .button {

	color: var(--green);

}

.template .listing .items .file[data-file="xls"] .button {

	color: var(--blue);

}

.recipes .listing .items > *:not(hr):not(.button) {

	background: transparent;

	max-width: 100%;

	margin: 0;

	padding: 10px;

}

.recipes .listing .items {

	margin: -10px;

}

.recipes .listing .item {

	padding: 0;

	position: relative;

	background: white;

	display: flex;

	flex-direction: column;

}

.recipes .listing .item > a {

	display: block;

	position: relative;

	margin: 0;

	padding: 0;

	overflow: hidden;

	width: 100%;

}

.recipes .listing .item p {

	flex: 1;

	display: flex;

	justify-content: center;

	align-items: center;

}

.recipes .listing .item > a::before {

	position: absolute;

	color: var(--green);

	top: 50%;left: 50%;

	transform: translate(-50%,-50%);

	background: url('/images/icons/lupe.svg') 0%/contain no-repeat;

	width: 37px;

	height: 37px;

	z-index: 3;

	opacity: 0;

	content: '';

	transition: all 0.4s ease;

}

.recipes .listing .item > a:hover::before {

	opacity: 1;

}

.recipes .listing .item > a:hover::after {

	opacity: 0.8;

}

.recipes .listing .item > a:hover ~ .hover {

	opacity: 0;

}

.recipes .listing .item > a::after {

	position: absolute;

	content: '';

	top: 0;left: 0;

	width: 100%;

	height: 100%;

	background: black;

	opacity: 0;

	z-index: 2;

	transition: all 0.4s ease;

}

.recipes .listing .item p {

	width: 100%;

	padding: 20px 40px;

	letter-spacing: -0.4px;

	line-height: 1.3;

	text-align: center;

	color: #323232;

	font-family: var(--font-family-1);

	margin: 0;

	user-select: none;

}

.content .template .recipes .listing .items .item-container {

	max-height: initial;

}



.content .listing-meals .container .items .item {

	display: flex;

	flex-direction: column;

	position: relative;

	transition: all 0.3s ease;

	position: relative;

}

.content .listing-meals .container .items .item .bg {

	position: relative;

}

.content.where-buy .listing > .container {

	padding: 0;

}

.content.where-buy .listing .container .items > .items-row {

	padding: 0;

	margin: -20px 0;

}

@media(min-width: 768px) {

	.content .list.switch-sides .container .item {

		margin-bottom: 40px; 

		padding: 0; 

	}

	.content.where-buy .listing .container .item {

		text-align: center;

	}

	.content.where-buy .listing {

		padding: 50px 0;

	}

	.content.where-buy .listing .container .items > .items-row {

		justify-content: center;

		display: flex;

		margin: 0;

		transition: all 0.3s ease;

	}

	.content .listing-meals .container .items {

		display: flex;

		flex-wrap: wrap;

	}

	.content .listing-meals > .container {

		padding: 0 40px;

	}

	.content .listing-meals .container .items .item {

		margin: 0;

		padding: 20px;

	}

	.content .listing-meals .container .items .item,

	.recipes .listing .items > *:not(hr):not(.button) {

		max-width: 50%;

	}

	.blog .listing .items .article > a.title {

		font-size: 50px;

	}

	.blog .listing .items > *:not(hr):not(.button) {

		padding: 30px 10px;

		margin: 0;

	}

	.blog .listing .items  {

		display: flex;

		flex-wrap: wrap;

		margin: -30px -10px;

		justify-content: center;

	}

	.blog .listing .items > * {

		max-width: 50%;

	}

	.filter .select-parent:nth-child(2) {

		z-index: 2;

	}

	.filter > * {

		padding: 5px;

	}

	.filter .select-parent {

		width: 50%;

	}

	.blog .listing .items > .article > a.title + div {

		font-size: 21px;

	}

	.content .template * + .listing {

		margin-top: 70px;

	}

	

	.listing .header {

        display: flex;

	    align-items: center;

    }



    .listing .link {

        margin-top: 0;

	}

	.listing .header h2,

	.listing .header .h2 {

		font-size: 40px;

	}

	.content .template li {

		font-size: 20px;

	}

	.recipes .listing .items {

		justify-content: center;

		display: flex;

		flex-wrap: wrap;

	}

}

@media(min-width: 992px) {

	.recipes .listing .items {

		margin: -25px;

	}

	.content .template .recipes .listing:last-child {

		margin-top: 0;

	}

	.recipes .listing .items > *:not(hr):not(.button) {

		max-width: 33.333%;

		padding: 25px;

	}

}

@media(min-width: 1024px) {

	.content.where-buy .listing .container .items > .items-row.expand {

		margin-bottom: 300px;

	}



	.select-parent .close {

		width: 15px;

		height: 15px;

	}

	.blog .listing .items .article > a.img {

		margin-bottom: 16px;

	}

	.listing .article .lower {

		margin-top: 30px;

	}

	.blog .listing .items .article {

		padding: 0 0 30px 0;

	}

	.blog .listing .items .article > a.title > h2 {

		line-height: 1.2;

	}

	.blog.article .listing .items .article > p {

		margin: 25px 0;

		color: black;

	}

	.blog .listing .items .article > p {

		margin: 27px 0;

	}

	.filter .search input {

		font-size: 16px;

	}

	.blog .listing .items .article > a.title + div > .date {

		font-weight: normal;

		margin-right: 5px;

	}

	.filter > * {

		padding: 10px;

	}

	.filter {

		margin: -10px;

	}

	.filter .select-parent {

		max-width: 318px; /* 298px + 20px padding */

	}

	.filter .search-parent {

		flex: 1;

	}

	.filter + div {

		margin-top: 80px;

	}

	.blog.article .listing .items > *:not(hr):not(.button) {

		max-width: 33.333%;

	}

	.blog .listing .items > *:not(hr):not(.button) {

		padding: 25px;

		margin: 0;

	}

	.blog .listing .items  {

		margin: -25px;

	}

}

@media(min-width: 1200px) {

	.content .list.switch-sides .container .item {

		margin-bottom: 80px; 

	}

	.ready.range .details .info .info-wrapper > .container,

	.ready.page .details .preparation-method .info-wrapper > .container {

		padding: 0 80px;

	}



	.ready.range .details .info .info-wrapper .top {

		padding-bottom: 75px;

	}

	.ready .details .info .info-wrapper ul li {

		font-size: 20px;

		line-height: 1.4;

		letter-spacing: -0.2px;

	}

	.ready.range .details .info .top .subtitle::before,

	.ready.range .details .info .top .subtitle::after {

		width: 47px;

		height: 56px;

	}

	

	.ready.range .details .info .top .subtitle::before {

		

	}

	.ready.range .details .info .top .subtitle {

		font-size: 56px;

		margin-right: 0;

		padding: 0 40px;

	}

	.content .listing-meals > .container {

		padding: 0 20px;

	}

	.listing-meals > .container .items { 

		margin: -40px;

	}

	.content.where-buy .listing > .container .items {

		margin: -20px;

	}

	.content.where-buy .listing .container .items .item {

		padding: 30px 20px;

	}

	.content .listing-meals .container .items .item {

		padding: 40px;

	}

	.recipes .listing .items > *:not(hr):not(.button) {

		max-width: 25%;

	}

}

/************************************/

/********** LISTING FILTER **********/

/************************************/



.listing .filter {

    margin-bottom: 30px;

    position: relative;

    text-align: center;

    white-space: nowrap;

    overflow: auto;

    font-size: 0;

}

.listing .filter.glossary-filter {

    display: flex;

    flex-wrap: nowrap;

    margin-bottom: 30px;

}



.listing .filter > div {

    font-size: 12px;

    font-weight: bold;

    color: var(--grey);

    letter-spacing: .02em;

    text-transform: uppercase;

    display: inline-block;

    position: relative;

    padding: 0 10px 10px;

    transition: var(--transition);

    -webkit-transition: var(--transition);

    cursor: pointer;

}

.listing .filter.glossary-filter > div {

    font-size: 16px;

    padding: 0 0 8px;

    border-bottom: 1px solid #e0dedd;

    margin-bottom: 1px;

    flex: 1;

    min-width: 27px;

}

.listing .filter > div:hover, .listing .filter > div.active {

    color: var(--black);

}

.listing .filter > div.disabled {

    color: #d9d9d9;

    pointer-events: none;

}



.listing .filter > div::before, .listing .filter .line {

    position: absolute;

    bottom: 0;left: 0;

    width: 27px;

    height: 3px;

    background-color: rgb(var(--primary));

    transition: all .5s ease-in-out;

}

.listing .filter .line.hidden {

    opacity: 0;

}



.listing .filter > div::before {

    content: "";

    right: 0;

    margin: auto;

    opacity: 0;

    transition: var(--transition);

    -webkit-transition: var(--transition);

}

.listing .filter.glossary-filter > div::before {

    width: 100%;

    bottom: -2px;

}

.listing .filter > div.initial::before {

    opacity: 1;

}





@media(min-width: 992px) {

    .listing .filter {

        margin-bottom: 60px;

    }



    .listing .filter > div {

        padding: 0 18px 10px;

    }

}





/****************************************/

/********** LISTING PAGINATION **********/

/****************************************/



.listing .pagination {

	margin-top: 40px;

	justify-content: center;

}



.listing .pagination ul {

	display: block;

	text-align: center;

	list-style: none;

	font-size: 0;

	padding: 0;

	margin: 0 -7px;

}

.listing .pagination ul li {

	font-size: 16px;

	font-weight: bold;

	color: var(--brown);

	line-height: 1;

	display: inline-block;

}

.listing .pagination ul li.disabled {

	pointer-events:none;

	opacity: .4;

}

.listing .pagination ul li.prev {

	margin-right: 10px;

}

.listing .pagination ul li.next {

	margin-left: 10px;

}

.listing .pagination ul li::before {

	content: normal;

}

.listing .pagination ul li a,

.listing .pagination ul li.ellipsis {

    padding: 0 7px;

	display: inline-block;

	border: none;

}

.listing .pagination ul li a:hover,

.listing .pagination ul li a:focus,

.listing .pagination ul li.active a {

	color: var(--black);

	border: none;

}



.listing .pagination ul li.prev a, 

.listing .pagination ul li.next a {

    width: 20px; 

    height: 10px;

	background-image: url(/assets/img/arrow-color.svg);

	background-repeat: no-repeat; 

}

.listing .pagination ul li.prev a {

	transform: rotate(180deg);

}





@media(min-width: 768px) {

    .listing .pagination {

        margin-top: 60px;

    }

}



@media(min-width: 992px) {

    .listing .pagination {

        margin-top: 70px;

    }



    .listing .pagination ul {

        margin: 0;

	}

    .listing .pagination ul li a,

    .listing .pagination ul li.ellipsis {

		padding: 0 9px;

	}

	.listing .pagination ul li.prev {

		margin-right: 15px;

    }

    .listing .pagination ul li.next {

        margin-left: 15px;

    }

    .listing .pagination ul li.prev a,

    .listing .pagination ul li.next a {

        width: 27px;

        height: 12px;

	}

}





/******************************************/

/********** GENERIC ITEM LISTING **********/

/******************************************/



.listing .item {

    padding:20px;

}



.listing .item h3,

.listing .item .h3 {

	flex: 1;

	padding-right: 20px;

}

.listing .link {

	margin-top: 20px;

}





@media(min-width: 768px) {

    .listing .item {

        padding: 25px 0;

        display: flex;

        align-items: center;

    }



    .listing .item .link {

		margin: 0;

    }

}





/**********************************/

/********** FILE LISTING **********/

/**********************************/



.listing .file {

	padding: 20px;

	display: flex;

	align-items: center;

	flex-wrap: wrap;

}



.listing .file .image {

	width: 40px;

}



.listing .file h3,

.listing .file .h3 {

	flex: 1;

    padding: 0 20px 0;

    min-width: calc(100% - 40px);

}



@media(min-width: 768px) {	

    .listing .file h3,

    .listing .file .h3 {

		min-width: auto;

	}

	

	.listing .file .link {

		margin: 0;

	}

}





/***************************************/

/********** ACCORDION LISTING **********/

/***************************************/



.listing {

	counter-reset: accordion;

}



.listing .accordion.numbered {

	counter-increment: accordion;

}



.listing .accordion > div {

	position: relative;

	cursor: pointer;

	transition: var(--transition);

    -webkit-transition: var(--transition);

}

.listing .accordion.numbered > div {

	padding-left: 30px;

}

.listing .accordion.numbered > div:first-child::before {

	content: counter(accordion) ".";

	font-size: 16px;

	font-weight: bold;

	color: rgb(var(--primary));

	line-height: 1em;

	position: absolute;

	left: 0;

	top: 0;bottom: 0;

	height: 1em;

	width: 1em;

	margin: auto;

}

.template .listing .accordion h3,

.template .listing .accordion .h3,

.template .listing .accordion h2,

.template .listing .accordion .h2 {

	padding-right: 35px;

	text-transform: initial;

	margin: 0;

	color: black;

	letter-spacing: normal;

}



.listing .accordion > div:first-child:hover h2, .listing .accordion > div:first-child:focus h2, .listing .accordion.open > div:first-child h2,

.listing .accordion > div:first-child:hover .h2, .listing .accordion > div:first-child:focus .h2, .listing .accordion.open > div:first-child .h2,

.listing .accordion > div:first-child:hover h3, .listing .accordion > div:first-child:focus h3, .listing .accordion.open > div:first-child h3,

.listing .accordion > div:first-child:hover .h3, .listing .accordion > div:first-child:focus .h3, .listing .accordion.open > div:first-child .h3 {

	color: var(--green);

}



.listing .accordion .toggle {

	height: 26px;

	width: 26px;

	position: absolute;

	top: 0;bottom: 0;

	right: -20px;

	margin: auto;

	color: #76bd1d;

	transition: var(--transition);

    -webkit-transition: var(--transition);

}

@media(min-width: 720px) {

	.listing .accordion .toggle {

		right: -5px;

	}

}

.listing .accordion .toggle:hover,

.listing .accordion .toggle:focus {

	transform:scale(1.1);

}

.listing .accordion .toggle::before,

.listing .accordion .toggle::after {

	content: "";

	position: absolute;

	top: 0;bottom: 0;

	margin: auto;

	height: 2px;

	width: 100%;

	background-color: currentColor;

	transition: var(--transition);

    -webkit-transition: var(--transition);

}

.listing .accordion .toggle::after {

	transform: rotate(90deg);

}

.listing .accordion.open .toggle::after,

.listing .accordion.active .toggle::after {

	transform: rotate(0deg);

}



.listing .accordion .description {

    padding: 0;

	max-height: 0;

	overflow: hidden;

	transition: var(--transition);

	cursor: default;

	margin-top: 15px;

}

.listing .accordion.numbered .description {

    padding-left: 0;

}

.listing .accordion.active .description {

	max-height: none;

}

.listing .accordion .description p,

.listing .accordion .description ul,

.listing .accordion .description ol {

	font-size: 16px;

}



.listing .accordion .description > *:first-child {

	margin-top: 5px;

}

.listing .accordion .description > *:last-child {

	margin-bottom: 30px;

}



.listing .accordion .description .button {

	padding: 10px 25px;

	margin-top: 35px;

}





@media(min-width: 768px) {	

	.template .listing .accordion h3, 

	.template .listing .accordion .h3, 

	.template .listing .accordion h2, 

	.template .listing .accordion .h2, 

	.template .listing .file h3, 

	.template .listing .file .h3, 

	.template .listing .file h2, 

	.template .listing .file .h2, 

	.template .listing .item h3, 

	.template .listing .item .h3, 

	.template .listing .item h2, 

	.template .listing .item .h2 {

		font-size: 20px;

	}

	.listing .items > *:not(hr):not(.button) {

		padding: 40px 30px 30px;

		margin: 10px 0;

	}

    .listing .accordion.numbered > div,

    .listing .accordion.numbered .description {

        padding-left: 40px;

    }

	

	.listing .accordion .description {

		padding-right: 65px;

    }

    

	.listing .accordion .description > *:first-child {

		margin-top: 15px;

	}

	.listing .accordion .description > *:last-child {

		margin-bottom: 40px;

	}

}

@media(min-width: 992px) {

	.listing .accordion .description p, 

	.listing .accordion .description ul, 

	.listing .accordion .description ol {

		font-size: 20px;

	} 

}



/**********************************/

/********** BLOG LISTING **********/

/**********************************/



.listing .article {

	padding: 25px 0 40px;

	height: 100%;

}

.listing .article:first-child {

	padding-top: 0;

}

.related.listing .article .lower {

	margin-top: 20px;

}

.listing .article .lower {

	margin-top: 35px;

	display: flex;

	align-items: flex-start;

}

.listing .article .lower > div {

	flex: 1;

}



.listing .article img {

	display: block;

	margin: 35px auto;

}



.listing .article .button {

    font-size: 12px;

    padding: 13px 25px;

	

}



@media(min-width: 768px) {

    .listing .article {

        padding: 35px 0 50px;

    }

}



@media(min-width: 992px) {

    .listing .article .button {

		padding: 13px 35px;

	}

	.template .listing .accordion h3,

	.template .listing .accordion .h3,

	.template .listing .accordion h2,

	.template .listing .accordion .h2 {

		font-size: 20px;

	}



}

.blog.article .listing .items .article > *:not(.img) a.button {

	font-weight: 300;

}

@media(min-width: 1200px) {

	.blog.article .listing .items .article > *:not(.img) a.button {

		padding: 15px 35px;

	}

	.blog .listing .items .article > *:not(.img) {

		padding: 0 30px;

	}

	.blog .listing .items .article > a.title + div {

		font-size: 21px;

	}

}

/************************************/

/********** BUTTON LISTING **********/

/************************************/



.listing.listing-button .items {

    margin: -5px;

    font-size: 0;

}



.listing.listing-button .button {

    margin: 5px;

    padding: 14px 26px;

    letter-spacing: 0;

}



@media(min-width: 992px) {

    .listing.listing-button .button {

		padding: 18px 26px;

	}

}



/*************************************************/

/********** ITEM WITH THUMBNAIL LISTING **********/

/*************************************************/



.listing .image-item {

    padding: 20px 0;

    display: flex;

    flex-wrap: wrap;

}

.listing .image-item:first-child {

    padding-top: 0;

}

.listing .image-item:last-child {

    padding-bottom: 0;

}



.listing .image-item .image {

    width: 90px;

    height: 90px;

    position: relative;

    margin-right: 20px;

}

.listing .image-item .image img {

    position: absolute;

    top: 0;bottom: 0;

    left: 0;right: 0;

    margin: auto;

    max-width: 100%;

    max-height: 100%;

}



.listing .image-item > div:not(.image) {

    flex: 1;

}





@media(min-width: 768px) {

    .listing .image-item {

        padding: 35px 0;

    }



    .listing .image-item .image {

        margin-right: 75px;

    }

}





/******************************************/

/********** MINI ARTICLE LISTING **********/

/******************************************/



.listing.listing-mini-article .items.row,

.listing.listing-mini-article .container.container-sm .items.row {

    margin: -15px

}

.listing .article.mini-article,

.listing .container.container-sm .article.mini-article {

    padding: 15px

}



.listing .article.mini-article img {

	margin: 0;

}

.listing .article.mini-article h2,

.listing .article.mini-article .h2 {

    font-size: 1.875rem;

    margin-top: 15px;

}



.listing .article.mini-article .video {

    position:relative;

    display: block;

}

.listing .article.mini-article .video::before {

	content: "";

	position: absolute;

	top: 0;bottom: 0;

	left: 0;right: 0;

	background-color: rgba(1,1,1,.4);

}

.listing .article.mini-article .video::after {

	content: "";

	position: absolute;

	top: 0;bottom: 0;

	left: 0;right: 0;

	margin: auto;

	height: 60px;

	width: 60px;

	background-image: url(/template1/assets/img/play-white.svg);

	border: 2px solid white;

	border-radius: 100%;

	opacity: .7;

    transition: var(--transition);

}

.listing .article.mini-article .video:hover::after {

	opacity: 1;

}



.listing .article.mini-article .lower {

    display: block;

    margin-top: 20px;

    margin-bottom: 15px;

}

.listing .article.mini-article .lower span {

    padding-bottom: 0;

    padding-top: 0;

}

.listing .article.mini-article .lower span:not(:first-child) {

    padding-top: 12px;

}





@media(min-width: 768px) {

    .listing .article.mini-article h2,

    .listing .article.mini-article .h2 {

        font-size: 1.375rem;

    }

}



@media(min-width: 992px) {

    .listing.listing-mini-article .items.row {

        margin: -34px

    }

    .listing.listing-mini-article .container.container-sm .items.row {

        margin: -25px

    }

    .listing .article.mini-article {

        padding: 34px

    }

    .listing .container.container-sm .article.mini-article {

        padding: 25px

    }

}





/*************************************************************/

/********** MINI ARTICLE LISTING (FULLSCREEN VIDEO) **********/

/*************************************************************/



.listing.listing-mini-article .video-fullscreen {

	position: fixed;

    top: 0;

    bottom: 0;

    left: 0;

    right: 0;

    background-color: rgba(1,1,1,.9);

    z-index: 10;

	opacity:0;

	pointer-events:none;

	transition:var(--transition);

}

.listing.listing-mini-article .video-fullscreen.visible {

	opacity: 1;

	pointer-events: auto;

}



.listing.listing-mini-article .video-fullscreen div {

    padding-top: 80px;

	height: 100%;

	width: 100%;

}

.listing.listing-mini-article .video-fullscreen div iframe {

	height: 100%;

	width: 100%;

}



.listing.listing-mini-article .video-fullscreen .close,

.hp-gallery.hp-gallery-fullscreen .close {

    position: absolute;

    top: 25px;

	right: 25px;

	height: 25px;

	width: 25px;

	opacity: 1;

}

.listing.listing-mini-article .video-fullscreen .close::before,

.video-fullscreen .close::after,

.hp-gallery.hp-gallery-fullscreen .close::before,

.hp-gallery.hp-gallery-fullscreen .close::after {

	content: "";

	position: absolute;

	top: 0;

	left: 0;

	height: 2px;

	width: 35px;

	background-color: white;

	transform: rotate(45deg);

	transform-origin: left

}

.listing.listing-mini-article .video-fullscreen .close::after,

.hp-gallery.hp-gallery-fullscreen .close::after {

	left: auto;right: 0;

	transform: rotate(-45deg);

	transform-origin: right;

}





@media(min-width: 992px) {

	.listing.listing-mini-article .video-fullscreen div {

		padding: 100px;

	}

	

    .listing.listing-mini-article .video-fullscreen .close,

    .hp-gallery.hp-gallery-fullscreen .close {

        top: 35px;

        right: 35px;

	}

}





/************************************/

/********** SQUARE LISTING **********/

/************************************/



.listing.listing-square .items.row {

    margin: -20px

}

.listing .square {

    padding: 20px

}



.listing .square .image {

	padding-top: 100%;

	position: relative;

	display: block;

	overflow: hidden;

}

.listing .square .image img {

	position: absolute;

	top: 0;bottom: 0;

	left: 0;right: 0;

	margin: auto;

	max-width: 100%;

	max-height: 100%;

}





@supports(mix-blend-mode: multiply) {		

	.listing .square .image img {

		filter: grayscale(1);

		filter: grayscale(100%);

		transition: var(--transition);

    	-webkit-transition: var(--transition);

	}

	.listing .square .image:hover img, .listing .square .image:focus img {

		filter: grayscale(0);

		filter: grayscale(0%);

	}

}





@media(max-width: 767px) and (orientation: landscape) {

    .listing .square {

        flex-basis: 50%;

        max-width: 50%;

    }

}



@media(min-width: 768px) {

    .listing.listing-square .items.row {

        margin: -15px

    }

    .listing .square {

        padding: 15px

    }

}



@media(min-width: 992px) {

    .listing.listing-square .items.row {

        margin: -25px

    }

    .listing .square {

        padding: 25px

    }

}





/**********************************/

/********** CARD LISTING **********/

/**********************************/



.listing.listing-card .items.row {

	margin: -10px

}

.listing .card {

	padding: 10px

}



.listing .card .image {

	padding-top: 150%;

	position: relative;

	display: block;

	overflow: hidden;

}

.listing .card .image img {

	position: absolute;

	top: 50%;left: 50%;

	min-width:100%;

	min-height:100%;

	/* IE */

	transform: translate(-50%, -50%);

	width: auto;

	max-width: none;

}



.listing .card .description {

	padding: 28px 30px;

	background-color: white;

	text-align: center;

}



.listing .card .description p {

	font-family: var(--font-family-1);

	font-size: 1rem;

	font-weight: 500;

	color: black;

	text-transform: uppercase;

	margin: 0;

	margin-bottom: 5px;

}

.listing .card .description span {

	font-size: 1rem;

	font-weight: 300;

	color: var(--grey);

	margin: 0;

	display: block;

}





@supports(mix-blend-mode: multiply) {

	.listing .card .image img {

		width: 100%;

		height: 100%;

		object-fit: cover;

		transform: none;

		top: 0;left: 0;

	}

}





@media(max-width: 767px) and (orientation: landscape) {

    .listing .card > div {

        flex-basis: 50%;

        max-width: 50%;

    }

}