// The CSS for the listing/archive page.
body { // wrapping ina  body tag makes rules more specific
	ul.geodir-category-list-view {
		list-style: none !important;
		margin: 0 !important;
		padding: 0 !important;

		& > li {
			margin: 0;
			padding: 20px 0 0 0 !important;
			clear: both;
			font-size: 12px;
			list-style: none !important;
		}

		li {

			p {
				clear: both;
				font-size: 14px;

			}

			.gd-rating {
				margin: 0;
				i, svg {
					margin: 0 1px;
				}
			}

			.geodir_post_meta {
				margin: 5px 0;
			}

			.geodir-control-nav {
				li {
					margin: 0 2px;
					a {
						height: 6px;
						width: 6px;
					}
				}
			}

			.gd-list-item-left {
				display: inline-block;
				width: 30%;
				//margin-right: 3%;
				//padding-right: 3%;
				float: left;
				position: relative;
				overflow: hidden;

				.geodir-post-img {
					box-sizing: border-box;
					display: inline-block;
					position: relative;
					width: 100%;
					background: #fff;
					padding: 1%;
					float: left;
					margin-right: 3%;

					.geodir_thumbnail {
						min-width: 100%;
						max-width: 100%;
						margin: 0;
						padding: 0;
						float: left;
						width: 100px;
						background-position: 50% 50%;
						background-repeat: no-repeat;
						background-size: cover;
						position: absolute;
						top: 0;
						bottom: 0;
						left: 0;
						right: 0;
						border-radius: 3px;
						&.geodir_lazy_load_thumbnail {
							opacity: 0;
							transition: opacity .5s ease-in;
							image-rendering: optimizequality;
						}
					}

					&:after {
						content: '';
						display: block;
						margin-top: 65%;
					}
				}
			}

			.gd-list-item-right {
				display: inline-block;
				vertical-align: top;
				width: 67%;
				float: left;
				position: relative;
				//overflow: hidden; // this will hide business hours one gridview
				padding-left: 3%;

				.geodir-post-info {
					font-size: 12px;
					margin-top: 5px;

					& > span {
						float: left;
					}

					.gd-rating {
						margin: 0;
					}

					.gd-list-rating-stars,
					.gd-list-rating-text {
						display: inline-block;
					}

					.gd-list-favorite {
						float: right;
					}
				}

				.geodir-field-post_content,
				.geodir-post-content-container{
					text-align: justify;
					position: relative;
					overflow: hidden;
					clear: both;
					p {
						margin: 0;
						padding: 0;
					}


					.gd-read-more-fade {
						position: absolute;
						bottom: 0;
						left: 0;
						width: 100%;
						text-align: center;
						margin: 0;
						padding: 30px 0 0 0;
						background-image: linear-gradient(to bottom, transparent, #FFF);
					}

				}

				.geodir-post-meta-container{
					.geodir-field-post_content{
						max-height: 120px;

						.gd-read-more-fade {
							display: none;
						}
					}
				}

			}

			.gd-badge-meta + .geodir-post-rating{
				clear:both;
			}

			h2,h3 {
				margin: 0;
				padding: 0;
				font-size: 14px;
				font-weight: bold;
				a {
					//color: #505050;
				}
			}
		}

		// grid view
		&.geodir-gridview {

			//@todo do we maybe want o use not-in() to keep it as it was?
			//.geodir-fav-text, .gd-list-rating-text{
			//	display: none;
			//}

			& > li {
				width: 100%;
				margin-bottom: 15px;
				display: inline-block;
				vertical-align: top;
				clear: none;
				float: none;

				.gd-list-item-left, .gd-list-item-right {
					display: block;
					width: 100%;
					float: none;
					padding: 0;
					margin: 0;
					clear: both;
				}
			}

			&.gridview_onehalf {

				// hide classes
				.gd-lv-2{
					display: none;
				}
				.gd-lv-s-2{
					//post meta
					.geodir_post_meta_icon{
						.geodir_post_meta_title{
							display: none;
						}
					}
					// post review, post fav
					.geodir-fav-text, .gd-list-rating-text,.gd-bh-today-range,.gd-secondary{
						display: none;
					}
				}

				& > li {
					width: 48%;
				}
				& > li:nth-child(2n+0) {
					margin-left: 4%;
				}
			}

			&.gridview_onethird {

				// hide classes
				.gd-lv-2,.gd-lv-3{
					display: none;
				}
				.gd-lv-s-2,.gd-lv-s-3{
					//post meta
					.geodir_post_meta_icon{
						.geodir_post_meta_title{
							display: none;
						}
					}
					// post review, post fav
					.geodir-fav-text, .gd-list-rating-text,.gd-bh-today-range,.gd-secondary{
						display: none;
					}
				}

				& > li {
					width: 32%;
					margin-left: 2%;
				}
				& > li:nth-child(3n+1) {
					margin-left: 0;
				}
			}

			&.gridview_onefourth {

				// hide classes
				.gd-lv-2,.gd-lv-3,.gd-lv-4{
					display: none;
				}
				.gd-lv-s-2,.gd-lv-s-3,.gd-lv-s-4{
					//post meta
					.geodir_post_meta_icon{
						.geodir_post_meta_title{
							display: none;
						}
					}
					// post review, post fav
					.geodir-fav-text, .gd-list-rating-text,.gd-bh-today-range,.gd-secondary{
						display: none;
					}
				}

				& > li {
					width: 23%;
					margin-left: 2.66%;
				}
				& > li:nth-child(4n+1) {
					margin-left: 0;
				}
			}

			&.gridview_onefifth {

				// hide classes
				.gd-lv-2,.gd-lv-3,.gd-lv-4,.gd-lv-5{
					display: none;
				}
				.gd-lv-s-2,.gd-lv-s-3,.gd-lv-s-4,.gd-lv-s-5{
					//post meta
					.geodir_post_meta_icon{
						.geodir_post_meta_title{
							display: none;
						}
					}
					// post review, post fav
					.geodir-fav-text, .gd-list-rating-text,.gd-bh-today-range,.gd-secondary{
						display: none;
					}
				}

				// hide hours one onefith
				.gd-bh-today-range{
					display: none;
				}

				& > li {
					width: 18%;
					margin-left: 2.5%;
				}
				& > li:nth-child(5n+1) {
					margin-left: 0;
				}
			}

		}

		@media only screen and (max-width: $media-tablet) {
			& > li {
				width: auto;
				margin-bottom: 15px;
				display: inline-block;
				vertical-align: top;

				.gd-list-item-left, .gd-list-item-right {
					display: block;
					width: 100%;
					float: none;
					padding: 0;
					margin: 0;
					clear: both;
				}
			}

			& > li {
				width: 48% !important;
				margin-left: 0 !important;
			}
			& > li:nth-child(2n+0) {
				margin-left: 4% !important;
			}
		}

		@media only screen and (max-width: $media-phone-small) {
			& > li {
				width: 100% !important;
				margin-left: 0 !important;
			}
			& > li:nth-child(2n+0) {
				margin-left: 0 !important;
			}
		}
	}
}

.geodir-meta-inline{
	display: inline;
	margin-right: 5px;
}

// pagination css

.geodir-pagination{

	ul.page-numbers{
		list-style: none !important;
		border-top: 1px #eee solid;
		overflow: hidden;
		min-width: 170px;
		margin: 0;
		padding: 20px 0 !important;
		li{
			position: relative;
			float: left;
			padding: 6px 12px;
			line-height: 1.42857143;
			text-decoration: none;
			background-color: #fff;
			border: 1px solid #eee;
			border-right: none;
			margin: 0;
			list-style: none !important;

			&:first-child{
				border-top-left-radius: 4px;
				border-bottom-left-radius: 4px;
			}
			&:last-child{
				border-top-right-radius: 4px;
				border-bottom-right-radius: 4px;
				border-right: 1px solid #eee;
			}

		}
	}
}


// author actions
.gd-author-actions{
	&> span:nth-child(n+2){
		padding-left: 10px;
	}
}

// sortby select
.geodir-sort-by{
	min-width: 150px;
}

// View all link
.widget {
	.geodir-viewall {
		font-weight: normal;
		display: inline-block;
		float: right;
		text-transform: inherit;
	}
}
.geodir-widget-bottom {
	text-align: center;

	.geodir-all-link {
	}
}

// pinpoint
.gd-pinpoint-info-wrap {
	clear:both;
}

/* widget pagination */
.geodir-ajax-listings-loader {
	display: none;
}

.geodir-wgt-pagination {
	position: relative;
}

.geodir-listings-loading {
	.geodir-ajax-listings-loader {
		display: block !important;
		position: absolute;
		left: 49%;
		top: 40%;
	}

	.geodir-widget-posts {
		opacity: .5;
	}
}

.geodir-post-distance {
	clear: both;
}
/* Listings Slider */
body .geodir_flex-container ul.geodir-category-list-view.geodir-gridview.geodir-slides > li {
	margin-left: inherit !important;
}
body .geodir_flex-container ul.geodir-category-list-view.geodir-gridview.geodir-slides > li:first-child {
	margin-left: 0 !important;
}
body .geodir_flex-container ul.geodir-category-list-view.geodir-slides > li {
	clear: none;
}
.geodir-posts-carousel .elementor-posts.geodir-slides {
	display: block;
	margin-bottom: 30px
}