/* CAROUSEL */
.img-carousel{
	height: 500px;
}
/* CAROUSEL */
/* PUBLICIDAD */

.publicidad-content{
	display: flex; 
	justify-content: center; 
	width:100%; 
	height: 678px;
}
/* bramito */
.publicidad-content .bramito{
	width: 45%; 
	height: 100%;
}
/* bramito */
.patrocinantes{
	width: 55%; 
	height:85%; 
	display: flex; 
	align-items:center; 
	flex-direction:column;
}
/* PUBLICIDAD */
/* SECCION 2 */
.content-info{
	width: 100%;
	height: 200px;
	display: flex;
	justify-content: center;
	align-items: center;
}
.content-info .more-info{
	text-align: center;
	border-bottom: 3px solid #FFCC33;
	width: 70%;
}
.content-info .more-info p{
	font-size: 23px;
	font-weight: bold;
}

/* SECCIÓN 2 */
/* SECCIÓN 3 about-us*/
.about-us{
	width: 100%;
	height: 400px;
	display: flex;
	justify-content: center;
	align-items: center;
}
.image-container {
	position: relative; /* Establece el contexto de posicionamiento para los hijos */
	width: 50%; /* Ajusta el ancho según tus necesidades */
	height:100%; /* Ajusta la altura según tus necesidades */
	padding: 10px;
  }

  .image {
	position: absolute;
	border-radius: 10px; /* O cualquier otro valor para las esquinas redondeadas */
  }
  
  .image-left {
	top: 10%;
	left: 10%;
	width: 60%; /* Ajusta el ancho de la imagen izquierda */
	height: 40%; /* Ajusta la altura de la imagen izquierda */
	object-fit: cover; /* Para que la imagen cubra el contenedor sin deformarse */
	z-index: 1;
}
  
  .image-right {
	bottom: 20%; /* Ajusta la posición vertical de la imagen derecha */
	right: 10%; /* Ajusta la posición horizontal de la imagen derecha */
	width: 30%; /* Ajusta el ancho de la imagen derecha */
	height: 45%; /* Ajusta la altura de la imagen derecha */
	object-fit: cover;
	z-index: 2; /* Asegura que la imagen derecha esté por encima del overlay */
  }
  
  .overlay {
	position: absolute;
	top: 20%;
	left: 50%; /* Ajusta la posición horizontal del overlay */
	width: 30%; /* Ajusta el ancho del overlay */
	height: 50%; /* Ajusta la altura del overlay */
	background-color: #009900; /* El color verde */
	border-radius: 10%;
	z-index: 0; /* Coloca el overlay entre las imágenes */
  }
.about-us .about-words{
	width: 45%;
	height: 85%;
	background-color: #009900;
	border-radius: 15px;
	color: #fff;
	display: flex;
	flex-direction: column;
	padding: 15px;
}
.about-us .about-words h4{
border-bottom: 3px solid #FFCC33;

}
/* .about-us .about-words p{

} */
/* SECCIÓN 3 about-us*/
/* SERVICIOS */
.services-content{
	width: 100%;
	height: 400px;
	display: flex;
	justify-content: space-around;
	align-items: center;
}
.services-content .services{
	width: 200px;
	height: 300px;
	display: flex;
	align-items: center;
	flex-direction: column;
}
.services-content .services .content-services-image{
	background-color: #009900;
	border-radius: 100%;
	width: 100%;
	height: 150px;
	display: flex;
	justify-content: center;
	align-items: center;
}
.services-content .services svg{
	width: 100px;
	height: 100px;
	fill: #fff;
} 
.services-content .services .content-services-image{
	background-color: #009900;
	border-radius: 100%;
	width: 100%;
	height: 150px;
	display: flex;
	justify-content: center;
	align-items: center;
}
.services-content .services .services-words{
	text-align: center
}	
.services-content .services .services-words h5{
font-size: 18px;

}
.services-content .services .services-words p{
	font-size: 16px;
}
/* SERVICIOS */
/* NOTICIAS */
.img-noticias{
	width: 200px;
	height: 250px;
}
/* NOTICIAS */
/* PIE DE PÁGINA */
.before-foot{
	width: 100%;
	height: 30px;
	background-color: #FFCC33;
}
footer{
	width: 100%;
	height: 200px;
	background-color: #009900;
}
/* DISEÑO RESPONSIVE */
@media (max-width: 750px){
	.about-us .about-words p{
		font-size: 13px;
	}
	
}
@media (max-width: 730px){
	.img-carousel{
		height: 400px;
	}
	.content-info .more-info p{
		font-size: 15px;
	}

}
@media (max-width: 585px){
	.publicidad-content{
		display: flex;
		flex-direction: column;
		align-items: center;
		height: 1200px;
		margin-top: 25px;
		
	}
	.publicidad-content .bramito{
		width: 95%;
		height: 500px
		margin-bottom: 10px;
	}
	.patrocinantes{
		width: 100%;
	}
	.about-us{
		height: 500px;
		flex-direction: column-reverse;
	}
	
}
@media (max-width: 560px){
	.about-us .about-words{
		width: 90%;
		height: 70%;
	}
	.image-container {
		width: 90%;
	}
	.services-content{
		flex-direction: column;
		height: 800px;
	}
}
@media (max-width: 500px){
	.img-carousel{
		height: 300px;
	}
	.content-info{
		height: 100px;
	}
}
@media (max-width: 480px){
	.content-info .more-info{
		width: 90%;
	}
	/* .content-info .more-info p{
		font-size: 10px;
	} */
}
@media (max-width: 400px){
	.img-carousel{
		margin-top: 100px;
		height: 200px;
	}
}
@media (max-width: 375px){
	.content-info .more-info p{
		font-size: 12px;
	}
}
@media(max-width: 300px){
	.content-info .more-info p{
		font-size: 9px;
	}
}