[class*="cms-post-layout-"],
[class*="cms-blog-layout-"]{
	.cms-item-content{
		.post-image{
			overflow: hidden;
		}
		.cms-svg-divider{
			@include scale(0);
		}
		&:hover{
			.cms-media img,
			.cms-media-bg img{
				@include transform(scale(1.1));
			}
			.cms-svg-divider{
				@include scale(1);
			}
			.cms-post--icon{
				@include transform(translateY(-10px));
			}
		}
	}
}
// layout 1
.cms-post-layout-1{
	.cms-item-content{
		&:after{
			content: '';
			height: 4px;
			background-color: $accent-color;
			width: 0;
			position: absolute;
			left: 40px;
			bottom: 0;
			visibility: hidden;
			opacity: 0;
			@include transition();
			[dir="rtl"] &{
				left: auto;
				right: 40px;
			}
			@media (max-width: $screen-sm-max){
				left: 20px;
				[dir="rtl"] &{
					left: auto;
					right: 20px;
				}
			}
		}
		&:hover{
			&:after{
				visibility: visible;
				opacity: 1;
				width: calc( 100% - 80px);
				@media (max-width: $screen-sm-max){
					width: calc( 100% - 40px);
				}
			}
			.cms-readmore{
				color: $accent-color;
			}
		}
	}
}
// Layout 2
.cms-post-layout-2{
	.cms-overlaps-divider{
		top: -13px;
	}
	.cms-btn-wraps{
		border-top: $border-main;
	}
}
// Layout 3
.cms-post-layout-3{
	.cms-readmore{
		.cms-readmore-icon{
			width: 68px;
			height: 68px;
			line-height: 68px;
			font-size: 20px;
			display: block;
			text-align: center;
			color: $white;
			background: #{'rgba(var(--color-accent-rgb), 0.9)'};
			position: absolute;
			top: 50%;
		    left: 50%;
		    transform: translate(-50%, -50%);
		}
		&:hover{
			background: #{'rgba(var(--color-accent-rgb), 0.9)'};
			.cms-readmore-icon{
				background: transparent;
			}
		}
		@media (min-width: $screen-xl-min){
			visibility: hidden;
			opacity: 0;
		}
	}
	.cms-post-cat{
		padding: 5px 10px;
		color: $white;
		a{
			color: $white;
			&:hover{
				color: $primary-color;
			}
		}
	}
	.cms-item-content-title{
		max-height: 56px;
		overflow: hidden;
	}
	.cms-item-content--inner{
		&:after,
		&:before{
			content: '';
			position: absolute;
			left: 50px;
			right: 50px;
			bottom: 0;
			height: 2px;
			display: block;
			@include transition();
		}
		&:before{
			background: $accent-color;
			width: 0;
			z-index: 1;
		}
		&:after{
			background: $primary-color;
		}
	}
	.cms-item-content:hover{
		.cms-readmore{
			visibility: visible;
			opacity: 1;
		}
		.cms-item-content--inner:before{
			width: calc(100% - 100px);
		}
	}
}
// Layout 4
.cms-post-layout-4{
	.cms-posts-heading{
		margin-bottom: 50px;
	}
	.cms-post-icon-wrap{
	    top: -2px;
	    z-index: 1;
	}
	.cms-post--icon{
		width: 92px;
	    height: 104px;
	    text-align: center;
	    line-height: 104px;
	    display: block;
	}
	.cms-item-content-title{
		@media (min-width: $screen-xl-min){
			max-width: 93%;
		}
	}
	.cms-btn-wraps{
		border-top: $border-main;
		padding-top: 30px;
		margin-top: 30px;
	}
	.cms-svg-divider{
		@include transform(scale(0));
	}
	.cms-item-content:hover{
		.cms-post-icon,
		.cms-readmore{
			background: $accent-color;
		}
		.cms-svg-divider{
			@include transform(scale(1));
		}
	}
}
// Layout 5
.cms-post-layout-5{
	.cms-item-content{
		// Hover
		&:hover{
			.cms-btn-readmore{
				background-color: $accent-color;
			}
		}
	}
}
// Layout 6
.cms-post-layout-6{
	.cms-item-content-title{
		max-height: 56px;
		overflow: hidden;
	}
}
// layout 8
.cms-post-layout-8{
	.cms-overlay-content{
		background-color: rgba(#1b1a1a, 0.5)!important;
		&:before{
			content: '';
			display: block;
			position: absolute;
			top: 0;
			right: 0;
			bottom: 0;
			left: 0;
			opacity: 0.7;
			background-image: linear-gradient(0deg, rgba(34,34,34,1) 0%, rgba(34,34,34,0) 38%, rgba(34,34,34,0) 98%);
		}
	}
}
// Layout 9
.cms-post-layout-9{
	.cms-media-small .cms-btn-wraps{
		top: 50%;
		left: 0;
		right: 0;
		@include transform(translateY(-50%));
	}
	@media (min-width: $screen-lg-min){
		.cms-post-item-readmore{
			opacity: 0;
			visibility: hidden;
		}
	}
	.cms-post--icon{
		color: $accent-color;
	}
	.cms-item-content--inner:before{
		content: '';
		display: block;
		position: absolute;
		top: 0;
		right: 0;
		left: 0;
		z-index: 1;
		height: 6px;
		background: $accent-color;
	}
	.cms-item-content{
		// Hover
		&:hover{
			.cms-post-item-readmore{
				visibility: visible;
				opacity: 1;
			}
			.cms-item-content-inner{
				color: $white;
				.cms-post--icon,
				.cms-item-content-title a{
					color: $white;
				}
			}
		}
	}
	// Other text

	// Dots & Nav 
	.cms-other-text-wrap{
		.cms-swiper-dots-arrows{
			@media (min-width: $screen-lg-min){
				position: absolute;
				top: 0;
				right: 0;
				[dir="rtl"] &{
					right: auto;
					left: 0;
				}
			}
		}
	}
}