// blogs 4
.blog_area_4 {
	@extend .section_padding;
	background: transparent;
	.single_blog_item_3{
	    position: relative;
    	z-index: 1;
    	margin-bottom: 50px;
    	&:hover .blog_img img{ transform: scale(1.1) rotate(2deg); }
		.blog_img{
			border-radius: 10px;
    		overflow: hidden;
    		img{ @include transition(all, .3s, ease-in-out); }
		}
		.blog_info{
		    position: absolute;
		    @include gradient_bg_4(top);
		    width: 100%;
		    height: auto;
		    top: 69%;
		    cursor: pointer;
		    @include transition(all, .3s, ease-in-out);
		    left: 10px;
		    color: #fff;
		    border-radius: 20px;
		    padding: 20px;
			.meta_date{
				display: inline-block;
			    padding: 5px 10px;
			    background: white;
			    border-radius: 5px;
			    font-size: 16px;
			    color: $brand_2;
			    @include firasans(400);
			    margin-bottom: 15px;
			}
			h2{
				font-size: 24px;
				@include firasans(700);
				@include transition(all, .3s, ease-in-out);
			}
			&:hover h2{ color: #fff; }
		}
	}
}



// Responsive
@media #{$medium_device}{

}
@media #{$tab_device}{
	.blog_area_4 {
		.single_blog_item_3{
			.blog_info{
			    padding: 15px 10px;
				.meta_date{
					font-size: 14px;
				    margin-bottom: 15px;
				}
				h2{ font-size: 18px; }
			}
		}
	}

}
@media #{$small_mobile}{
	.blog_area_4 {
		.single_blog_item_3{
			margin-bottom: 80px;
			.blog_info{ top: 55%; }
		}
	}
}
@media #{$large_mobile}{
	.blog_area_4 {
		.single_blog_item_3{
			margin-bottom: 80px;
			.blog_info{  top: 82%; }
		}
	}
}