.body {
	min-height: 100vh;
	width: 100%;
	display: flex;
	flex-direction: column;
	justify-content: space-between; /* Manda al header y footer al extremo*/
	align-items: center;
}
.main {
	width: 100%;
}
/* SECCION CARRUSEL */
.carrusel {
	margin-bottom: 20px;
}
/* CONTENEDOR PRINCIPAL*/
.carrusel_contenedor {
	max-width: 850px;
	width: 100%;
	max-height: 375px;
	height: 300px;
	overflow: hidden;
	display: flex;
	flex-direction: column;
}
/* 2DO CONTENEDOR */
.contenedor__diapositivas {
	width: 500%;
	height: 300px;
	display: flex;
}
/* Ocultar los botones */
.diapositivas__input {
	display: none;
}
/* Ajustando la imagen para q entre uno por pantalla*/
.diapositivas__banner {
	width: 20%;
	transition: 2s;
}
/* Ajustando el tamaño de las imagenes del carrusel*/
.banner__img {
	max-width: 100%;
	width: 100%;
	max-height: 375px;
	height: 300px;
}
/*Imagen banner para mobile*/
.banner_1 {
    content: url('https://www.textiltetco.com/src/img/banner/mobile_banner_1.png');
}
.banner_2 {
    content: url('https://www.textiltetco.com/src/img/banner/mobile_banner_2.png');
}
.banner_3 {
    content: url('https://www.textiltetco.com/src/img/banner/mobile_banner_3.png');
}
.banner_4 {
    content: url('https://www.textiltetco.com/src/img/banner/mobile_banner_4.png');
}
/* css para navegacion manual*/
.contenedor__navigation-manual {
	position: absolute;
	width: 100%;
	display: flex;
	justify-content: center;
	margin-top: 260px;
	left: 50%;
	transform: translate(-50%, -50%);
}
.navigation-manual__btn {
	border: 2px solid var(--color-primary);
	padding: 5px;
	border-radius: 10px;
	cursor: pointer;
	transition: 1s;
}
.navigation-manual__btn:not(:last-child) {
	margin-right: 40px;
}
.navigation-manual__btn:hover {
	background: var(--color-primary);
}
/* Animacion para posicionar siguiente banner */
#radio1:checked ~ .diapositivas__banner--first {
	margin-left: 0;
}
#radio2:checked ~ .diapositivas__banner--first {
	margin-left: -20%;
}
#radio3:checked ~ .diapositivas__banner--first {
	margin-left: -40%;
}
#radio4:checked ~ .diapositivas__banner--first {
	margin-left: -60%;
}
/* css para navegacion automatica */
.diapositivas__navigation-auto {
	position: absolute;
	display: flex;
	width: auto;
	justify-content: center;
	margin-top: 260px;
	left: 50%;
	transform: translate(-50%, -50%);
}
.navigation-auto__btn {
	border: 2px solid var(--color-primary);
	padding: 5px;
	border-radius: 10px;
	transition: 1s;
}
.navigation-auto__btn:not(:last-child) {
	margin-right: 40px;
}
#radio1:checked ~ .diapositivas__navigation-auto .navigation-auto__btn--1 {
	background: var(--color-primary);
}
#radio2:checked ~ .diapositivas__navigation-auto .navigation-auto__btn--2 {
	background: var(--color-primary);
}
#radio3:checked ~ .diapositivas__navigation-auto .navigation-auto__btn--3 {
	background: var(--color-primary);
}
#radio4:checked ~ .diapositivas__navigation-auto .navigation-auto__btn--4 {
	background: var(--color-primary);
}

/* SECCION PRODUCTOS */
.productos {
	display: flex;
	flex-direction: column;
}
.container {
	margin-bottom: 40px;
}
.content__h1 {
	font-weight: 500;
}
.content__span {
	display: block;
	font-weight: 800;
}

/* Carruseles */
.categoria__carrusel {
	width: 80%;
}

/* Estilo categoria */
.producto__categoria {
	width: 80%;
	background-color: var(--color-primary);
	align-self: center;
	justify-self: center;
	display: flex;
	flex-direction: row;
	align-items: center;
	min-height: 50px;
	padding-left: 10px;
	color: var(--white);
	margin: 20px 0;
}
.categoria__img {
	margin-right: 10px;
	height: 30px;
	object-fit: cover;
}
.categoria__h2 {
	font-size: 18px;
}

/* SECCION SERVICIOS */
.servicios {
	width: 100%;
	padding: 40px 66px;
	text-align: center;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	align-items: center;
	background-color: var(--color-primary);
	color: var(--white);
	height: 600px;
	margin: 20px auto;
}
.servicios__h3 {
	font-size: 18px;
}
.servicios__img {
	margin: 10px 0;
	transition: all 0.5s;
}
.servicios__p {
	font-size: 16px;
}
.servicios__h3--pago {
	margin-bottom: 11px;
}
.servicios__p--pago {
	margin-top: 11px;
}
.servicios__img--asesoria:hover {
	transform: scale(1.1);
}
.servicios__img--pago:hover {
	animation: pago 2s;
}
.servicios__img--envio:hover {
	animation: compras 2s;
}
@keyframes pago {
	0% {
		transform: scale(1.1);
	}
	50% {
		margin: 10px 0;
		transform: rotate3d(0, 5, 0.5, 3.142rad);
	}
	100% {
	}
}
@keyframes compras {
	0% {
		transform: rotate(-5deg);
	}
	50% {
		transform: scale(1.1);
		margin: 10px 0;
	}
	100% {
		transform: translate(100px);
	}
}
.slick-arrow {
	visibility: hidden !important;
}
/* Centrar las tarjetas en el carrusel del index*/
.card {
	margin: 0px !important;
	margin-right: 20px !important;
	margin-top: 10px !important;
}
.contact--modifier {
	color: white;
}
@media screen and (min-width: 768px) {
	header {
		margin-bottom: 20px;
	}
	.banner__img {
    	max-width: 850px;
    	width: 100%;
    	max-height: 375px;
    	height: 300px;
    }
    /*Imagen banner para mobile*/
    .banner_1 {
        content: url('https://www.textiltetco.com/src/img/banner/pc_banner_1.png');
    }
    .banner_2 {
        content: url('https://www.textiltetco.com/src/img/banner/pc_banner_2.png');
    }
    .banner_3 {
        content: url('https://www.textiltetco.com/src/img/banner/pc_banner_3.png');
    }
    .banner_4 {
        content: url('https://www.textiltetco.com/src/img/banner/pc_banner_4.png');
    }

	/* SECCION CARRUSEL*/
	.carrusel {
		display: flex;
		justify-content: center;
		align-items: center;
		width: 100%;
		margin-bottom: 40px;
	}
	.carrusel_contenedor {
		margin: 0 87px;
	}

	/* SECCION SERVICIOS */
	.servicios {
		flex-direction: row;
		justify-content: space-evenly;
		align-items: start;
		width: 100%;
		padding: 40px 25px;
		height: auto;
		margin: 40px auto;
	}
	.slick-arrow {
		visibility: visible !important;
	}
	.categoria__carrusel {
		width: 75%; /*75*/
	}
}

.productos{
	display: flex;
	align-items: center;
	width: 100%;
	overflow: hidden;
}

.categoria__carrusel .slick-prev::before, .categoria__carrusel .slick-next::before {
	color: var(--color-primary) !important;
	font-size: 50px !important;
}
.categoria__carrusel .slick-prev::before {
	margin-left: -2vw;
}
.clientes {
	overflow: hidden;
}