.jet-smart-listing {
	display: flex;
	flex-wrap: wrap;
	margin-left: -10px;
	margin-right: -10px;
	margin-bottom: 40px;

	&-wrap {
		position: relative;
	}

	// Featured Post
	&__featured {
		display: flex;
		flex-direction: column;
		margin: 10px;
		position: relative;
		overflow: hidden;
		transform: translateY( 20px );
		opacity: 0;
		animation: appear 400ms forwards;

		&.featured-layout-boxed {
			background-size: cover;
			justify-content: flex-end;
		}
		&.featured-position-top {
			width: 100%;
			max-width: 100%;
		}
		&.featured-img-left {
			flex-direction: row;
			@media (max-width: 1024px) {
				flex-wrap: wrap;
			}
		}
		&.featured-img-right {
			flex-direction: row-reverse;
			@media (max-width: 1024px) {
				flex-wrap: wrap;
			}
		}
		&-box-link {
			display: flex;
			flex-direction: column;
			height: 100%;
			justify-content: flex-end;
			padding: 15px;
			position: relative;
			&:before {
				position: absolute;
				left: 0;
				top: 0;
				right: 0;
				bottom: 0;
				content: '';
				z-index: 1;
			}
			> * {
				position: relative;
				z-index: 2;
			}
		}
		&-content {
			.featured-img-left & {
				flex-grow: 1;
			}

			.featured-img-left.has-post-thumb & {
				margin-left: 20px;
			}
			.featured-img-right.has-post-thumb & {
				margin-right: 20px;
			}
			.featured-img-top.has-post-thumb & {
				margin-top: 20px;
			}
		}
	}
	&.has-featured-position-left,
	&.has-featured-position-right {
		flex-wrap: nowrap;
		@media (max-width: 1024px) {
			flex-wrap: wrap;
		}
	}
	&.has-featured-position-right {
		flex-direction: row-reverse;
	}
	
	&__more {
		.elementor .elementor-inner & {
			transition: all 200ms;
			&-wrap {
				display: flex;
			}
			display: inline-flex;
			align-items: center;
			&-icon {
				margin-left: 5px;
				text-decoration: none;
			}
			&-text {
				display: inline-block;
				order: 0;
			}
		}
	}

	// Standard posts wrapper
	&__posts {
		display: flex;
		flex-wrap: wrap;
		margin-left: 10px;
		margin-right: 10px;
		align-self: flex-start;

		.has-featured-position-top &,
		.no-featured & {
			max-width: 100%;
			flex-basis: 100%;
		}

		@media (max-width: 1024px) {
			max-width: 100% !important;
			flex-basis: 100% !important;
		}

		@for $i from 1 through 8 {
			.columns-#{$i} & {
				.jet-smart-listing__post-wrapper {
					max-width: 100%/$i;
					flex: 0 0 100%/$i;
				}
			}
		}

		@media (max-width: 1024px) {
			@for $i from 1 through 8 {
				.columns-tablet-#{$i} & {
					.jet-smart-listing__post-wrapper {
						max-width: 100%/$i;
						flex: 0 0 100%/$i;
					}
				}
			}
		}
		@media (max-width: 767px) {
			@for $i from 1 through 8 {
				.columns-mobile-#{$i} & {
					.jet-smart-listing__post-wrapper {
						max-width: 100%/$i;
						flex: 0 0 100%/$i;
					}
				}
			}
		}
	}

	// Standard posts item
	&__post {
		display: flex;
		align-content: flex-start;
		margin-top: 10px;
		margin-bottom: 10px;
		position: relative;
		animation: appear 400ms forwards;
		transform: translateY( 20px );
		opacity: 0;
		
		&.has-thumb-postion-right {
			flex-direction: row-reverse;
		}

		&.has-thumb-postion-top {
			flex-wrap: wrap;
		}
		&-thumbnail {
			flex: 0 0 auto;
			img {
				display: block;
				width: 100%;
				height: auto;
			}
			.has-thumb-postion-top & {
				flex: 1 0 100%;
				width: 100%;
				max-width: 100%;
			}
			.featured-img-left & {
				flex: 0 0 50%;
				width: 50%;
				max-width: 50%;
			}
			a {
				display: block;
				position: relative;
				overflow: hidden;
				&:before {
					position: absolute;
					left: 0;
					top: 0;
					right: 0;
					bottom: 0;
					content: '';
					z-index: 1;
				}
			}
		}
		&-content {
			flex-grow: 1;

			.has-thumb-postion-top.has-post-thumb & {
				margin-top: 20px;
			}
			.has-thumb-postion-left.has-post-thumb & {
				margin-left: 20px;
			}
			.has-thumb-postion-right.has-post-thumb & {
				margin-right: 20px;
			}
		}
	}

	&__post-wrapper {
		@for $i from 1 through 8 {
			.columns-#{$i} & {
				$k: 1;
				@for $j from 1 through 8 {

					$selector: '';
					$separator: '';

					@for $n from 1 through $i {
						$selector: $selector + $separator + '&:nth-child(' + $k + ')';
						$separator: ',';
						$k: $k + 1;
					}

					#{$selector} {
						animation-delay: $j*100ms;
					}
				}
			}
		}

		@media (max-width: 1024px) {
			@for $i from 1 through 8 {
				.columns-tablet-#{$i} & {
					$k: 1;
					@for $j from 1 through 8 {

						$selector: '';
						$separator: '';

						@for $n from 1 through $i {
							$selector: $selector + $separator + '&:nth-child(' + $k + ')';
							$separator: ',';
							$k: $k + 1;
						}

						#{$selector} {
							animation-delay: $j*100ms;
						}
					}
				}
			}
		}
		@media (max-width: 767px) {
			@for $i from 1 through 8 {
				.columns-mobile-#{$i} & {
					$k: 1;
					@for $j from 1 through 8 {

						$selector: '';
						$separator: '';

						@for $n from 1 through $i {
							$selector: $selector + $separator + '&:nth-child(' + $k + ')';
							$separator: ',';
							$k: $k + 1;
						}

						#{$selector} {
							animation-delay: $j*100ms;
						}
					}
				}
			}
		}

		.rows-1 & {
			@for $i from 1 through 8 {
				&:nth-child( #{$i} ) {
					animation-delay: $i*100ms;
				}
			}
		}
	}

	&__meta {
		&-icon {
			margin-right: 5px;
		}
		&-item {
			display: inline-block;
			&:not(:first-child):before {
				content: "";
				display: inline-block;
				margin-left: 5px;
				margin-right: 5px;
			}
			.jet-smart-listing__post {
				font-size: .75em;
			}
		}
		.post__date,
		.posted-by,
		.post__comments {
			font-size: inherit;
			font-weight: inherit;
			letter-spacing: inherit;
			line-height: inherit;
		}
	}

	// Block heading (title and filter)
	&__heading {
		display: flex;
		max-width: 100%;
		justify-content: space-between;
		align-items: center;
	}
	&__filter {
		&-item {
			display: inline-block;
			&[hidden] {
				display: none;
			}
			a {
				margin-left: 10px;
				display: block;
				transition: all 200ms;
			}
		}