.el-home-blog{
	position: relative;
	padding: 60px 0;
	background-image: url(../imagens/pattern-1.png);
	background-repeat: repeat;
	@include mq-min(1360) {
		padding: 120px 0;
	}
	@include mq-min(1920) {
		padding: valor-fluido(150, 1920) 0;
	}
	&:before{
		content: '';
		display: block;
		position: absolute;
		top: 0;
		right: 0;
		left: 0;
		height: 25%;
		background: radial-gradient(ellipse at top, rgba(#000, 0.05), transparent 50%);
	}
	.wrapper{
		position: relative;
		@include mq-min(1360) {
			display: flex;
			justify-content: space-between;
			align-items: center;
		}
		.v2{
			text-align: center;
			margin-bottom: 20px;
			@include mq-min(1360) {
				flex-grow: 0;
				flex-shrink: 0;
				width: 340px;
				text-align: left;
			}
			@include mq-min(1920) {
				width: valor-fluido(340, 1920);
				margin-bottom: valor-fluido(20, 1920);
			}
		}
		.itens{
			margin-bottom: 20px;
			@include tablet {
				display: flex;
				justify-content: space-between;
			}
			@include mq-min(1360) {
				flex-grow: 1;
				flex-shrink: 1;
				margin-left: 30px;
				margin-right: 80px;
				margin-bottom: 0;
			}
			@include mq-min(1920) {
				margin-left: valor-fluido(30, 1920);
				margin-right: valor-fluido(80, 1920);
			}
			.item{
				margin-bottom: 15px;
				@include tablet {
					margin-bottom: 0;
					width: 32%;
					&:nth-child(n) { margin-left: 2% }
					&:nth-child(3n+1) { margin-left: 0 }
				}
				a{
					display: block;
					position: relative;
					.img{
						img{
							display: block;
							margin: 0 auto;
							max-width: 100%;
							height: auto;
							border-radius: 5px;
							@include mq-min(1920) {
								width: valor-fluido(400, 1920);
								border-radius: valor-fluido(5, 1920);
							}
						}
					}
					.hover{
						display: flex;
						align-items: center;
						justify-content: flex-start;
						position: absolute;
						top: 0;
						right: 0;
						bottom: 0;
						left: 0;
						opacity: 1;
						background-color: rgba(#ffffff, 0.75);
						transition: 0.2s;
						@include desktop {
							opacity: 0;
							background-color: rgba(#ffffff, 0.9);
						}
						.center{
							width: 100%;
							padding: 0 10%;
							text-align: center;
							.titulo{
								font-size: 22px;
								font-weight: 300;
								color: $color_destaque;
								text-shadow: 0 0 5px rgba(#fff, 1);
								@include mq-min(1920) {
									font-size: valor-fluido(22, 1920);
								}
							}
						}
					}
					&:hover .hover{
						opacity: 1;
					}
				}
			}
		}
	}
	.btn-mais{
		display: flex;
		align-items: center;
		justify-content: center;
		@include mq-min(1360) {
			position: absolute;
			top: 50%;
			right: 3%;
			margin-top: -21px;
		}
		@include mq-min(1920) {
			margin-top: valor-fluido(-21, 1920);
		}
		a{
			display: flex;
			align-items: center;
			justify-content: center;
			width: 42px;
			height: 42px;
			border-radius: 50%;
			font-size: 40px;
			color: rgba(#ffffff, 0.75);
			background-color: #7a7a7a;
			transition: 0.2s;
			@include mq-min(1920) {
				width: valor-fluido(42, 1920);
				height: valor-fluido(42, 1920);
				font-size: valor-fluido(40, 1920);
			}
			&:hover{
				background-color: $color_destaque;
			}
		}
	}
}