.news-posts-slider.slick-initialized {
	margin-top: 40px !important;
}

.news-posts-slider.slick-initialized {

	left: 0;
	width: 100vw !important;
	max-width: 100vw !important;
	padding-right: 0 !important;

	.slick-list {
		margin-left: -10px;
		margin-right: -10px;
	}

	.post {

		display: flex;
		flex-direction: column;
		padding-left: 10px;
		padding-right: 10px;
		row-gap: 17px;
		width: 40vw !important;

		@media screen and (min-width: 1600px) {
			width: 600px !important;
		}

		@media screen and (max-width: 992px) {
			width: 60vw !important;
		}

		@media screen and (max-width: 662px) {
			width: 75vw !important;
		}

		&:hover {
			.image img {
				transform: scale(1.1);
			}
		}

		.image {
			border-radius: 10px;
			height: 375px;
			min-height: 300px;
			max-height: 50svh;
			overflow: hidden;
			position: relative;
			width: 100%;

			img {
				border-radius: 10px;
				height: 100%;
				object-fit: cover;
				object-position: center;
				transform: scale(1);
				transition: transform 0.8s ease-in-out;
				width: 100%;
			}

			.pill {
				border-radius: 4px;
				font-size: 14px;
				gap: 10px;
				justify-content: center;
				left: 20px;
				line-height: 1;
				padding: 7px 10px 7px 10px;
				position: absolute;
				top: 20px;
			}

		}

		.content {

			align-items: start;
			display: flex;
			flex: 1;
			flex-direction: column;
			padding-right: 30px;

			p {
				margin-top: 0 !important;
				margin-bottom: 0 !important;
			}

			p.date {
				margin: 0 !important;
				padding-left: 20px;
				position: relative;

				&::before {
					content: '';
					position: absolute;
					top: 50%;
					left: 0;
					height: 12px;
					width: 12px;
					opacity: 0.2;
					transform: translateY(-50%);
					border-radius: 50%;
				}

				&::after {
					content: '';
					position: absolute;
					top: 50%;
					left: 3px;
					height: 6px;
					width: 6px;
					transform: translateY(-50%);
					border-radius: 50%;
				}
			}

			p:nth-child(2) {
				flex: 1;
				position: relative;
			}

		}

	}

}

.news-slider {

	.slider-buttons {
		column-gap: 10px;
		display: flex;
		margin-top: 0 !important;
		justify-content: end;
		width: 100%;
		z-index: 2;

		@media screen and (min-width: 782px) {
			column-gap: 10px;
			display: flex;
		}

		@media screen and (max-width: 781px) {
			display: none;
		}

	}

}