#c-slider{	
	margin: auto;
	width: 100%;
	height: 200px;
	max-width: 1024px;
	overflow: hidden;
	position: relative;
	box-shadow:  3px 1px 20px 10px rgba(255,255,255,.5);
	}
#slider{	
	display: flex;
	width: 400%;
	}
#slider section{
	width: 100%;
	height: 200px;
	display: flex;
	flex-wrap: wrap;
	}
.internos{	
	width: 33.333333%;
	height: 200px;	
	filter: brightness(100%);
	position: relative;
	overflow: hidden;
	padding-left: .5%;
	padding-right: .5%;
	}
.internos .after{	
	color: #fff;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	text-align: center;	
	transform: rotate(45deg)translateY(350px)translateX(-100px);
	background: green;
	position: absolute;transition: .5s;
	}
.internos:hover .after{
	transform: rotate(45deg)translateY(100px)translateX(10px);	
	border-radius: 400px 0px 0px 0px;
	}
.internos .after h4{
	padding-top: 20px;
	padding-right: 100px;
	text-align: center;
	transform: rotate(-45deg);
	}
.internos img{
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;	
	transition: all 700ms;
	}
.internos:hover img{	
	filter: brightness(70%);
	transform: scale(1.2) rotate(3deg);
	}
#btn-prev,#btn-next{
	width: 50px;
	height: 50px;
	color: #fff;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	line-height: 40px;
	font-size: 30px;
	font-weight: bold;
	text-align: center;
	border-radius: 50%;
	font-family: monospace;
	cursor: pointer;
	background: rgba(255,255,0,.6);
	}
#btn-prev{
	left: 10px;
	}
#btn-next{
	right: 10px;
}#btn-prev img{
	width: 100%;
	height: 100%;
	transform: translateY(2px);
	filter: brightness(50%);
	}
#btn-prev img:hover{
	filter: brightness(100%);
	}
#btn-next img{	
	width: 100%;
	height: 100%;
	transform: translateY(-2px);
	filter: brightness(50%);
	}
#btn-next img:hover{	
	filter: brightness(100%);
	}
@media (max-width: 768px){
	.internos{
		width: 100%;
		height: 200px;
		}}
	@media (max-width: 650px){
		.internos:hover .after{
			transform: rotate(45deg)translateY(30px)translateX(10px);
			border-radius: 400px 0px 0px 0px;}}
			@media (max-width: 500px){
				.internos:hover .after{
					transform: rotate(45deg)translateY(0px)translateX(10px);
					border-radius: 400px 0px 0px 0px;}}
					@media (max-width: 400px){
						.internos:hover .after{
							transform: rotate(45deg)translateY(130px)translateX(10px);
							border-radius: 400px 0px 0px 0px;}}