.bg-barua{
	background-color: #00ae49 !important;
}
.gloria{
  font-family: "Gloria Hallelujah", cursive;
  font-weight: 400;
  font-style: normal;
}

.text-right{
	text-align: right !important;
}

.rojo-barua{
	color: #FF1C24 !important;
}

.gris-barua{
	color: #818181 !important;
}

.slide-text{
	font-size: 3.5rem !important;
	line-height: 3rem !important;
}

.bg-slide{
	background-color: #F0F0F0 !important;
}
.floating-buttons {
	position: fixed;
	bottom: 20px; /* Ajusta la distancia desde la parte inferior */
	left: 20px; /* Ajusta la distancia desde la izquierda */
	display: flex;
	flex-direction: row; /* Los botones se muestran en línea horizontal */
	gap: 10px; /* Espacio entre los botones */
}

.floating-button {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 50px;
	height: 50px;
	border-radius: 50%;
	background-color: #33A14B; /* Color de fondo para los botones */
	color: #fff; /* Color del texto/iconos */
	font-size: 20px;
	cursor: pointer;
}

.floating-button:hover {
	background-color: #0D541C; /* Cambia el color de fondo al pasar el cursor */
	color: #fff !important;
}

.text-justify{
	text-align: justify !important;
}

/* Estilo para el estado activo */
.dropdown-menu-custom .nav-link.active {
    background-color: #343a40; /* Fondo gris oscuro */
    color: white; /* Letras blancas */
}

/* Estilo para el estado hover */
.dropdown-menu-custom .nav-link:hover {
    background-color: #28a745; /* Fondo verde primary */
    color: white; /* Letras blancas */
}

/* Estilo para el estado focus */
.dropdown-menu-custom .nav-link:focus {
    background-color: #218838; /* Fondo verde oscuro */
    color: white; /* Letras blancas */
}

/* Estilo para el estado normal */
.dropdown-menu-custom .nav-link {
    background-color: #f8f9fa; /* Fondo gris claro */
    color: black; /* Letras negras */
}
/* Estilo para el estado activo */
.dropdown-menu-custom .nav-link.active {
    background-color: #343a40; /* Fondo gris oscuro */
    color: white; /* Letras blancas */
}

/* Estilo para el estado hover */
.dropdown-menu-custom .nav-link:hover {
    background-color: #28a745; /* Fondo verde primary */
    color: white; /* Letras blancas */
}
/* Estilo para el estado active */
.dropdown-menu-custom .nav-link:active {
    background-color: #28a745; /* Fondo verde primary */
    color: white; /* Letras blancas */
}
/* Estilo para el estado focus */
.dropdown-menu-custom .nav-link:focus {
    background-color: #218838; /* Fondo verde oscuro */
    color: white; /* Letras blancas */
}

/* Estilo para el estado normal */
.dropdown-menu-custom .nav-link {
    background-color: #f8f9fa; /* Fondo gris claro */
    color: black; /* Letras negras */
}


/* Estado normal (inactivo) - semitransparente */
.swiper-step-pagination .swiper-slide {
  background-color: rgba(0, 128, 0, 1) !important; /* Verde semitransparente */
  color: rgba(255, 255, 255, 0.5) !important; /* Blanco semitransparente */
  padding: 10px !important;
  text-align: center !important;
  border-radius: 10px !important;
  transition: background-color 0.3s ease, color 0.3s ease !important; /* Transición suave */
}

/* Estado activo - sin transparencia */
.swiper-step-pagination .swiper-slide.swiper-slide-active,
.swiper-step-pagination .swiper-slide:focus {
  background-color: green !important; /* Fondo verde completo */
  color: white !important; /* Texto blanco completo */
  outline: none !important; /* Quitar el borde por defecto al enfocar */
}


/* El estado focus también será sin transparencia */
.swiper-step-pagination .swiper-slide:focus {
  background-color: green !important;
  color: white !important;
}

@media (max-width: 600px) {
  .slide-transparent::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.5); /* Transparencia blanca */
    z-index: 1;
  }

  .slide-transparent .container,
  .slide-transparent .row,
  .slide-transparent .col-md-5 {
    position: relative;
    z-index: 2; /* Coloca el texto sobre la transparencia */
  }
}