body {
	background-color: #031b34;

	opacity: 1;
	height: 100%;
	height: 100%;
	margin: 0;
	/* Ajusta este valor según sea necesario para que coincida con tu diseño */
}

html {
	font-family: "Poppins", sans-serif;
}



#nombre::placeholder {

	font-family: "Poppins", sans-serif !important;
}

input {
	font-family: "Poppins", sans-serif;
	/* Cambia 'Arial' por la fuente que quieras usar */
}

.container {}

.feedback-text {}

.feedback-text p {}

.emojis {
	display: flex;
	justify-content: center;
	gap: 20px;
	/* Ajusta la distancia entre las imágenes según sea necesario */
}

.emojis img {}

.emojis img:hover {
	transform: scale(1.1);
}

.emojis img {
	cursor: pointer;
}

.contenedor-imagen-logo {
	height: 160px;
}

.contenedor-imagen-logo img {
	width: 140px;
	height: 160px;
	padding-left: 3em;
	padding-top: 2.5em;
}

.contenedor-padre {
	display: flex;
	color: white;
	width: 95%;
	margin: auto;
}

p.atendido {
	font-size: 53px;
	font-family: "Poppins", sans-serif;
	text-align: left;
	color: #FFFFFF;
	opacity: 1;
	margin-top: 2.5em;
	width: 100%;
  }

  .contenedor .click {
	font-size: 30px;
	width: 100%;
	margin-top: 3.5em;
  }


.contenedor-caritas {
	display: flex;
	justify-content: center;
	width: 515px;
	height: 183px;
	margin: 0 auto;
}

.contenedor-icono-texto {
	display: flex;
	flex-direction: row;
}


.contenedor-icono-texto .carita-formulario {
	object-fit: contain;
	padding: 1em;
	width: 6.5em;
}

.contenedor-icono-texto,
.contenedor-formulario {
	padding-left: 10%;
	padding-right: 20%;
}

.contenedor-icono-texto p.texto-formulario {
	color: black;
	background: white;
	border-radius: 20px;
	font-size: 20px;
	padding: 10px;
}

#formulario {
	display: flex;
	flex-wrap: wrap;
}


#formulario ::placeholder {
	color: black;
	padding: 5px;
}

#formulario #comentario {
	height: 6.5em;
	border-radius: 10px;
	margin: 10px;
	padding-top: 0.2em;
	flex-grow: 1
}

#formulario #nombre {
	width: 80%;
	height: 43px;
	border-radius: 10px;
	margin: 10px;

}

#formulario #correo {
	width: 80%;
	height: 43px;
	border-radius: 10px;
	margin: 10px;
}

#formValoracion img {
	height: 100%;
	object-fit: contain;
}

#formulario #boton-enviar {
	width: 15%;
	height: 43px;
	background: #77B0CD 0% 0% no-repeat padding-box;
	border: 1px solid #707070;
	border-radius: 10px;
	margin: 10px 0;
	color: white;

}

.contenedor-text-enviada {
	margin-top: 10%;
	color: #FF8A71;
	font-size: 60px;
	font-weight: 400;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
}

.contenedor-text-enviada p {
	margin: 0px !important;
}

#formValoracion {
	display: flex;
	justify-content: space-between;
	width: 100%
}

#formulario img.carita.carita-formulario {
	margin-right: 0.5em;
}

.contenedor .como {
	font-size: 30px;
}

#comentario::placeholder {
	margin-left: 1em !important;
	font-family: "Poppins", sans-serif !important;
}






.table thead th td {
	color: #ffffff !important;
	/* Bootstrap primary color */
}

.table-bordered td,
.table-bordered th {
	border: 1px solid #dee2e6;
	border-bottom-width: 1px;
	border-left-width: 1px;
	color: white;
}

#tablaValoraciones_info {
	color: white;
}

.page-item.active .page-link {
	z-index: 3;
	color: #fff;
	background-color: #031b34;
	border-color: #031b34;
}

.mb-4 {
	color: white;
}

label {
	color: white;
}



.contenedor {
	width: 53%;
}

.carita-contenedor {
	width: 31%;
	margin-right: 5em;
}

.contenedorCaras {
	margin-top: 21em;
	width: 100%;
}


.carita2 {
	height: 130% !important;
	object-fit: contain !important;
}

.porcentaje {
	font-size: 3em;
}

.porcentajeTotal {
	text-align: right;
}

.opinionesTotal {
	color: white;
	font-size: 50px;
	margin-right: 4.9em;
	font-weight: 300;
}

.conoceNuestroEquipo .texto {
	color: white;
	font-size: 50px;
	margin-left: 1em;
	font-weight: 300;
}

.conoceNuestroEquipo {
	text-align: left;
	margin-top: 2em;
}

.especialidades {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: space-around;
	align-items: stretch;
	align-content: stretch;
}


.especiacilidad {
	border: 2px solid white;
	border-radius: 22px;
	padding: auto;
	width: 18%;
	width: 300;
	height: 300;
	margin-top: 3em;
	margin-right: 0.3em;
  }

.es1 {
	background-image: url('../app/assets/img/TEAM_SOPORTETECNICO.jpg');
	/* Establecer imagen de fondo */
	background-size: cover;
	text-align: center;
}

.sop1 {
	background-image: url('../app/assets/img/TEAM_SOPORTETECNICO. ROBERTO.jpg');
	/* Establecer imagen de fondo */
	background-size: cover;
	text-align: center;
	background-position: center center;
}
.sop2 {
	background-image: url('../app/assets/img/agustin.jpg');
	/* Establecer imagen de fondo */
	background-size: cover;
	text-align: center;
	background-position: center center;
}
.sop3 {
	background-image: url('../app/assets/img/TEAM_SOPORTETECNICO. ZAKA.jpg');
	/* Establecer imagen de fondo */
	background-size: cover;
	text-align: center;
	background-position: center center;
}
.sop4 {
	background-image: url('../app/assets/img/TEAM_SOPORTETECNICO. NACHO.jpg');
	/* Establecer imagen de fondo */
	background-size: cover;
	text-align: center;
	background-position: center center;
}

.ad1 {
	background-image: url('../app/assets/img/TEAM_ADMINISTRACIÓN. MARIA.jpg');
	/* Establecer imagen de fondo */
	background-size: cover;
	text-align: center;
	background-position: center center;
}
.ad2 {
	background-image: url('../app/assets/img/TEAM_ADMINISTRACIÓN. ROXANA.jpg');
	/* Establecer imagen de fondo */
	background-size: cover;
	text-align: center;
	background-position: center center;
}

.D1 {
	background-image: url('../app/assets/img/TEAM_DISEÑO_SABINA.jpg');
	/* Establecer imagen de fondo */
	background-size: cover;
	text-align: center;
	background-position: center center;
}
.D2 {
	background-image: url('../app/assets/img/TEAM_DISEÑO. ESTI.jpg');
	/* Establecer imagen de fondo */
	background-size: cover;
	text-align: center;
	background-position: center center;
}
.D3 {
	background-image: url('../app/assets/img/TEAM_DISEÑO. CHRIS.jpg');
	/* Establecer imagen de fondo */
	background-size: cover;
	text-align: center;
	background-position: center center;
}

.MYC1 {
	background-image: url('../app/assets/img/TEAM_MARKETING. PATRICIA.jpg');
	/* Establecer imagen de fondo */
	background-size: cover;
	text-align: center;
	background-position: center center;
}
.MYC2 {
	background-image: url('../app/assets/img/TEAM_MARKETING. LUCIA.jpg');
	/* Establecer imagen de fondo */
	background-size: cover;
	text-align: center;
	background-position: center center;
}






.es2 {
	background-image: url('../app/assets/img/TEAM_DESARROLLO.jpg');
	/* Establecer imagen de fondo */
	background-size: cover;
	text-align: center;
}

.es3 {
	background-image: url('../app/assets/img/TEAM_ADMINISTRACIÓN.jpg');
	/* Establecer imagen de fondo */
	background-size: cover;
	text-align: center;
}

.es4 {
	background-image: url('../app/assets/img/TEAM_MARKETINGYCOMUNICACION.jpg');
	/* Establecer imagen de fondo */
	background-size: cover;
	text-align: center;
}
.es5 {
	background-image: url('../app/assets/img/TEAM_DISEÑO.jpg');
	/* Establecer imagen de fondo */
	background-size: cover;
	text-align: center;
	background-position: center center;
}

.des1 {
	background-image: url('../app/assets/img/TEAM_DESARROLLO. GUY.jpg');
	/* Establecer imagen de fondo */
	background-size: cover;
	text-align: center;
	background-position: center center;
}
.des2 {
	background-image: url('../app/assets/img/TEAM_DESARROLLO. CHRIS.jpg');
	/* Establecer imagen de fondo */
	background-size: cover;
	text-align: center;
	background-position: center center;
}

.textoes {
	background-color: white;
	display: block;
	margin-top: 5.5em;
	font-size: 25px;
	padding-top: 0.5;
	/*padding-bottom:  0.5em;*/
}

.valoracionesGlobal {
	display: flex;
	flex-wrap: wrap;
	/* Permite que los elementos se ajusten automáticamente a la siguiente línea */
	/* Fondo blanco para el contenedor global */
	justify-content: center;

}

.valoracionIndividual {
	flex: 0 47%;
	/* Ocupa 50% del espacio, colocando dos valoraciones por fila */
	box-sizing: border-box;
	/* Asegura que el padding y border no expandan el div más allá del 50% */
	padding: 10px;
	/* Espacio interno */
	background-color: white;
	/* Fondo blanco para cada valoración */
	margin: 1em;
	width: 364px;
	height: 341px;
	border: 2px solid white;
	border-radius: 53px;

}

.footer {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	align-items: stretch;
	align-content: stretch;
	margin: 2em;
	justify-content: space-evenly;

}

.contenedor-imagen-logo-footer img {
	width: 140px;
	height: 160px;

}

.reseñaFoo span {
	color: white;
}

.valoracionIndividual p {
	margin: 1em;

}

.reseñaFoo {
	margin-left: 3em;
	font-size: 25px;
	font-weight: 20;
	align-content: flex-end;
	width: 28%;

}

.RedesFoo {
	align-content: flex-end;
}

.RedesFoo a {
	font-size: 40px;
}

.caritas {
	width: 13%;
}



.contenedor .click.Soporte {
	font-size: 40px;
	width: 60%;
	margin-top: 6em;
}


.contenedor-padre.Soporte {
	display: flex;
	color: white;
	width: 95%;
	margin: auto;
	margin-bottom: auto;
	margin-bottom: auto;
	margin-bottom: 10em;
}

.especialidades.Desarrollo {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: flex-start;
	align-items: stretch;
	align-content: stretch;
	margin-right: 26em;
	margin-left: 4em;
}

.especiacilidad.sop1 {
	margin-right: 3em;
}

.contenedor .click.Soporte {
	font-size: 40px;
	width: 100%;
	margin-top: 2.5em;
  }

  .contenedor .click.MYC {
	font-size: 40px;
	width: 100%;
	margin-top: -0.5em;
  }
.contenedor .click.Desarrollo {
	font-size: 40px;
	width: 60%;
	margin-top: 4.5em;
}




@media (max-width: 800px) {
	html {
		height: 100%
	}

	body {
		height: unset;
		background-repeat: no-repeat
	}

	.contenedor-imagen-logo img {
		padding: 0;
		margin-left: 1em
	}

	p.atendido {
		font-size: 28px;
	}

	.contenedor-padre {
		display: flex;
		flex-direction: column;
		padding: 1em
	}

	.contenedor-padre div {
		width: 100%
	}

	.contenedor-padre .contenedor,
	.contenedor-padre .contenedor {
		width: 100%;
		padding: 0
	}

	.contenedor {
		display: flex;
		flex-direction: column;
	}

	.contenedor .como {
		margin-left: 0;
	}

	#formValoracion {
		margin: 0
	}

	.contenedor-caritas {
		height: 34vw;
		order: -1
	}

	.contenedor .click {
		font-size: 22px;
		width: 100%;
		margin-top: 0;
	  }

	.contenedorCaras {
		margin-top: 1em !important;
	}

	.contenedorCaras.mov {
		width: 28% !important;
	}

	.carita2 {
		height: 75% !important;
		object-fit: contain !important;
	}

	.carita-contenedor {
		width: 31% !important;
		margin-right: 6em !important;
	}

	.porcentaje {
		font-size: 1.5em;
	}

	.opinionesTotal {
		color: white;
		font-size: 22px !important;
		margin-right: 0;
		font-weight: 300;
		margin-left: 4% !important;
	}

	.porcentajeTotal {
		text-align: left !important;
	}

	.conoceNuestroEquipo .texto {
		color: white;
		font-size: 22px;
		margin-left: 4%;
		font-weight: 300;
	}

	.contenedor-imagen-logo img {
		padding: 0;
		margin-left: 1em;
		margin-top: 2em !important;
	}

	.especialidades {
		display: flex;
		flex-direction: column !important;

	}

	.especiacilidad {
		max-width: 80% !important;
		margin: 5% auto !important;
	}

	.especiacilidad {
		border: 2px solid white;
		border-radius: 22px;
		padding: auto;
		width: 302px !important;
		height: 177px !important;
		margin-top: 3em;
	}

	.textoes {
		background-color: white;
		display: block;
		margin-top: 5.5em !important;
		font-size: 14px !important;
		padding-top: 1em;
		padding-bottom: 1em;
	}

	.valoracionIndividual p {
		margin: 0.5 !important;
		font-size: 1em;
		margin-top: 1em;
	}

	.valoracionIndividual {
		flex: 0 100%;
		box-sizing: border-box;
		padding: 20px;
		padding-top: 20px;
		padding-top: 20px;
		background-color: white;
		margin: 1em;
		width: 364px;
		height: 216px !important;
		border: 2px solid white;
		border-radius: 53px;
		padding-top: 2em;
	  }

	.RedesFoo div {
		padding: 10px;
		display: flex;
	}

	.reseñaFoo {
		margin-left: 0;
		font-size: 25px;
		font-weight: 20;
		align-content: flex-end;
		width: 28%;
	}

	.contenedor .click.Soporte {
		font-size: 22px!important;
		width: 100%;
		margin-top: 0 !important;
	  }
	  .carita-contenedor {
		width: 31% !important;
		margin-right: 0em!important;
	  }
	  .contenedor-padre.Soporte {
		display: flex;
		color: white;
		width: 95%;
		margin: auto;
		  margin-bottom: auto;
		margin-bottom: auto;
		margin-bottom: auto;
		margin-bottom: 0em;
	  }
	  .contenedor-imagen-logo-footer img {
		width: 103px;
		height: 116px;
	  }
	  .RedesFoo a {
		font-size: 27px;
	  }
}
.especialidades {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-around;
	align-items: stretch;
	align-content: stretch;
	margin-left: 2em;
	margin-right: 2em;
  }
  
  .especialidad {
	flex-grow: 1;
	flex-basis: 100%; /* Inicialmente, cada elemento ocupará todo el ancho */
	box-sizing: border-box; /* Para incluir el padding y border dentro del tamaño */
  }
  
  /* Para pantallas más grandes */
  @media (min-width: 600px) {
	.especialidad {
	  flex-basis: calc(50% - 20px); /* Ajustar según el espacio que desees entre elementos */
	  margin: 10px; /* Ajusta el margen para crear espacio entre elementos */
	}
  }
  
  @media (min-width: 900px) {
	.especialidad {
	  flex-basis: calc(33.333% - 20px); /* Ajusta según el espacio que desees entre elementos */
	  margin: 10px; /* Ajusta el margen para crear espacio entre elementos */
	}
  }