
			.hidden{
				display: none;
			}

			.pointer{
				cursor: pointer;
			}

			.fondo{
				background-repeat: no-repeat;
			}

			.vcard_icono{
				color: #ffffff !important;
			}

			.vcard_enlace{
				color: #ffffff !important;
			}
			
			.sombra {
				border-radius: 28px 28px 28px 28px;
				-webkit-border-radius: 28px 28px 28px 28px;
				-moz-border-radius: 28px 28px 28px 28px;

				box-shadow: 23px 25px 24px -7px rgba(0,0,0,0.75);
				-webkit-box-shadow: 23px 25px 24px -7px rgba(0,0,0,0.75);
				-moz-box-shadow: 23px 25px 24px -7px rgba(0,0,0,0.75);
	    }

	   	#particles-js {
			  position: absolute;
			  width: 100%;
			  height: 100%;
			}

			.fondo{
	    	width: 68% !important; 
	    }

	    .fondo2{
	    	width: 68% !important; 
	    }

			html, body {
				margin: 0;
				padding: 0;
				color: #C0C0C0;
			}

			.bgs {	  
				position: absolute;
				display: block;
				top: 0;
				left: 0;
				z-index: -1;
			}

			.enlaces_especiales a {
			  text-decoration: none; /* Para quitar el subrayado de los enlaces */
			  color: black;
			  margin: 0 5px; /* Para separar ligeramente las palabras del separador */
			}

			.enlaces_especiales a + a::before {
			  content: '|'; /* Aquí está el separador */
			  margin-right: 10px; /* Espacio entre el separador y la palabra */
			  color: #555; /* Un color más tenue para el separador */
			}

			.flip-card-container {
			  width: 100%;
			  height: 600px;
			  perspective: 1000px; /* Para el efecto 3D */
			}

			@media screen and (max-width: 768px) {
        .flip-card-container {
            height: 220px; /* Altura flexible */
        }
	    }

			/*
			* Estilos de la tarjeta principal que rota.
			*/
			.flip-card {
			  width: 100% !important;
			  height: 100%;
			  /* position: relative; */
			  transform-style: preserve-3d;
			  transition: transform 0.8s ease-in-out;
			}

			.flip-card.is-flipped {
			  transform: rotateY(180deg);
			}

			/*
			* Estilos de cada cara de la tarjeta.
			*/
			.flip-card-face {
			  position: absolute;
			  width: 100%;
			  height: 100%;
			  backface-visibility: hidden; /* Oculta la cara cuando está girada */
			  /*border-radius: 12px;*/
			  /*box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);*/
			  padding: 20px;
			  /*box-sizing: border-box;*/
			  /*display: flex;*/
			  /*flex-direction: column;*/
			  /*justify-content: center;*/
			  /*align-items: center;*/
			  /*background-position: center;*/
			  /*background-size: cover;*/
			  /*background-repeat: no-repeat;*/
			}

			/* Contenedor de los botones */
		  .button-container {
	      display: flex;
	      gap: 30px;
	      /*margin-top: 20px;*/
	      place-self: anchor-center;
		  }
		  
		  /* Estilos de los botones de navegación */
		  .card-nav-btn {
	      background-color: rgba(0, 0, 0, 0.5);
	      color: white;
	      border: none;
	      /*padding: 10px;*/
	      cursor: pointer;
	      /*z-index: 10;*/
	      /*font-size: 1.5rem;*/
	      border-radius: 50%;
	      width: 20px;
	      height: 20px;
	      display: flex;
	      align-items: center;
	      justify-content: center;
	      transition: background-color 0.3s;
		  }

		  .card-nav-btn:hover {
		    background-color: rgba(0, 0, 0, 0.8);
		  }

			.flip-prev {
			  left: -50px; /* Posiciona el botón a la izquierda del contenedor */
			}

			.flip-next {
			  right: -50px; /* Posiciona el botón a la derecha del contenedor */
			}

			/* Contenedor de la tarjeta horizontal */
			.card-horizontal {
			  max-width: 24rem;
			  aspect-ratio: 10 / 6; /* Mantiene la proporción horizontal */
			}

			/* Contenedor de la tarjeta vertical */
			.card-vertical {
			  max-width: 18rem; /* Aumentamos el tamaño de la tarjeta vertical en móvil */
			  aspect-ratio: 9 / 16; /* Mantiene la proporción vertical */
			}

			@media (min-width: 768px) {
			  .card-horizontal {
			      max-width: 56rem;
			  }
			  .card-horizontal > div {
			      flex-direction: row; /* La imagen y el texto se colocan uno al lado del otro */
			  }
			  .card-horizontal .card-image-container, .card-horizontal .card-content {
			      width: 50%; /* Cada uno ocupa la mitad del ancho */
			      height: 100%;
			  }
			  .card-vertical {
			      width: 25rem; /* Aumentamos el tamaño de la tarjeta vertical en escritorio */
			  }
			  .card-content {
			      padding: 1.5rem;
			  }
			}

			/* Estilos del botón flotante de WhatsApp */
      .whatsapp-button {
        position: fixed;
        bottom: 2rem;
        right: 2rem;
        z-index: 1000;
        background-color: #25D366; /* Color de WhatsApp */
        border-radius: 50%; /* Hace el botón circular */
        box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
        transition: transform 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 3rem; /* w-16 */
        height: 3rem; /* h-16 */
      }

      .whatsapp-button:hover {
        transform: scale(1.1);
        box-shadow: 0 8px 12px rgba(0, 0, 0, 0.2);
      }

      .whatsapp-icon {
        color: white;
        font-size: 2.5rem;
        line-height: 1;
        width: 2rem; /* w-8 */
        height: 2rem; /* h-8 */
      }

		