{} *{} /*endBaseStyles*/
     


      #IE-warning {
        display: none;
        position: fixed;
        width: 100%;
        height: 100%;
        z-index: 9999;
        background: white;
      }
      .IE-warning-message {
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
        text-align: center;
      }
    



 :root { --color-primario: #E91E63; --color-secundario: #FF9800; --color-fondo: #FFF9F9; --color-texto: #333333; --color-blanco: #FFFFFF; --color-exito: #4CAF50; --color-dorado-ganador: #FFD700; --color-plata-ganador: #C0C0C0; --color-bronce-ganador: #CD7F32; --color-confeti-1: #FFC107; --color-confeti-2: #4CAF50; --color-confeti-3: #2196F3; --color-whatsapp: #25D366; } body { font-family: 'Poppins', sans-serif; margin: 0; padding: 0; background-color: var(--color-fondo); color: var(--color-texto); line-height: 1.6; overflow-x: hidden; } .container { max-width: 800px; margin: 0 auto; padding: 20px; position: relative; } .encabezado { background: linear-gradient(135deg, var(--color-primario), #FF4081); color: var(--color-blanco); text-align: center; padding: 60px 20px; margin-bottom: 40px; border-bottom: 5px solid var(--color-secundario); border-radius: 0 0 20px 20px; box-shadow: 0 5px 15px rgba(0,0,0,0.1); } .titulo-principal { font-family: 'Montserrat', sans-serif; font-size: 2.8rem; margin: 0; line-height: 1.2; text-shadow: 0 2px 4px rgba(0,0,0,0.3); animation: fadeInDown 1s ease-out; } .subtitulo { font-size: 1.5rem; margin: 15px 0 0; font-weight: 600; animation: fadeInUp 1s ease-out 0.5s; animation-fill-mode: backwards; } .seccion-ganadores { background-color: var(--color-blanco); border-radius: 12px; padding: 30px; margin-bottom: 30px; box-shadow: 0 8px 25px rgba(0,0,0,0.1); text-align: center; border-top: 5px solid var(--color-dorado-ganador); } .titulo-seccion { font-family: 'Montserrat', sans-serif; font-size: 2.2rem; color: var(--color-primario); margin-bottom: 30px; position: relative; } .titulo-seccion:after { content: "🎉"; font-size: 1.5em; position: absolute; right: -10px; top: -10px; transform: rotate(15deg); } .titulo-seccion:before { content: "🎊"; font-size: 1.5em; position: absolute; left: -10px; top: -10px; transform: rotate(-15deg); } .lista-ganadores { list-style: none; padding: 0; margin: 0; text-align: left; } .ganador-item { background-color: #f9f9f9; border: 1px solid #eee; border-left: 5px solid var(--color-secundario); padding: 15px 20px; margin-bottom: 15px; border-radius: 8px; box-shadow: 0 3px 8px rgba(0,0,0,0.05); transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out; } .ganador-item:hover { transform: translateY(-3px); box-shadow: 0 5px 12px rgba(0,0,0,0.1); } .ganador-item .puesto { font-family: 'Montserrat', sans-serif; font-weight: 900; color: var(--color-primario); font-size: 1.1rem; display: block; margin-bottom: 5px; } .ganador-item .nombre-ganador { font-weight: 600; font-size: 1.3rem; color: var(--color-texto); margin-bottom: 5px; } .ganador-item .premio { font-size: 1rem; color: #555; } .ganador-item.puesto-1 { border-left-color: var(--color-dorado-ganador); } .ganador-item.puesto-1 .puesto { color: var(--color-dorado-ganador); } .ganador-item.puesto-2 { border-left-color: var(--color-plata-ganador); } .ganador-item.puesto-2 .puesto { color: var(--color-plata-ganador); } .ganador-item.puesto-3 { border-left-color: var(--color-bronce-ganador); } .ganador-item.puesto-3 .puesto { color: var(--color-bronce-ganador); } .mensaje-felicitacion-general { font-size: 1.2rem; margin-top: 30px; font-weight: 600; color: var(--color-exito); } .seccion-video { background-color: var(--color-blanco); border-radius: 12px; padding: 30px; margin-bottom: 30px; box-shadow: 0 8px 25px rgba(0,0,0,0.1); text-align: center; } .video-responsive { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; margin: 20px auto; border-radius: 8px; box-shadow: 0 5px 15px rgba(0,0,0,0.2); max-width: 800px; } .video-responsive iframe, .video-responsive groovevideo-widget { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: none; } .seccion-whatsapp { background-color: var(--color-blanco); border-radius: 12px; padding: 30px; margin-bottom: 30px; box-shadow: 0 8px 25px rgba(0,0,0,0.1); text-align: center; border-top: 5px solid var(--color-whatsapp); } .whatsapp-button { display: inline-block; background-color: var(--color-whatsapp); color: var(--color-blanco); font-family: 'Montserrat', sans-serif; font-size: 1.2rem; font-weight: 700; padding: 12px 30px; border-radius: 50px; text-decoration: none; box-shadow: 0 4px 15px rgba(37, 211, 102, 0.3); transition: transform 0.3s, box-shadow 0.3s; margin-top: 15px; display: flex; align-items: center; justify-content: center; } .whatsapp-button:hover { transform: scale(1.05); box-shadow: 0 6px 20px rgba(37, 211, 102, 0.4); color: var(--color-blanco); } .whatsapp-button i { font-size: 1.5rem; margin-right: 10px; } .icono-whatsapp { font-size: 3rem; color: var(--color-whatsapp); margin-bottom: 15px; display: block; } .seccion-agradecimiento { text-align: center; padding: 20px; background-color: var(--color-exito); color: var(--color-blanco); border-radius: 12px; margin-bottom: 30px; font-size: 1.2rem; font-weight: 600; } .seccion-agradecimiento p { margin: 5px 0; } .boton-regreso { display: inline-block; background: linear-gradient(to right, var(--color-secundario), #FFA726); color: var(--color-blanco); font-family: 'Montserrat', sans-serif; font-size: 1.2rem; font-weight: 700; padding: 12px 30px; border-radius: 50px; text-decoration: none; box-shadow: 0 6px 20px rgba(255, 152, 0, 0.3); transition: transform 0.3s, box-shadow 0.3s; margin-top: 20px; } .boton-regreso:hover { transform: scale(1.05); box-shadow: 0 8px 25px rgba(255, 152, 0, 0.4); } .pie-pagina { text-align: center; padding: 30px; color: #777; font-size: 0.9rem; border-top: 1px solid #eee; margin-top: 50px; } .logo-pie { font-family: 'Montserrat', sans-serif; font-size: 1.8rem; color: var(--color-primario); margin-bottom: 10px; font-weight: 900; } @keyframes pulse { 0% { transform: scale(1); } 50% { transform: scale(1.03); } 100% { transform: scale(1); } } @keyframes fadeInDown { from { opacity: 0; transform: translateY(-30px); } to { opacity: 1; transform: translateY(0); } } @keyframes fadeInUp { from { opacity: 0; transform: translateY(30px); } to { opacity: 1; transform: translateY(0); } } .confeti { position: absolute; width: 10px; height: 10px; background-color: var(--color-confeti-1); opacity: 0.7; animation: fall 3s linear infinite; border-radius: 50%; z-index: 1000; } .confeti.c2 { background-color: var(--color-confeti-2); animation-delay: -0.5s; } .confeti.c3 { background-color: var(--color-confeti-3); animation-delay: -1s; } .confeti.c4 { background-color: var(--color-primario); animation-delay: -1.5s; } .confeti.c5 { background-color: var(--color-secundario); animation-delay: -2s; } @keyframes fall { 0% { transform: translateY(var(--initial-y-offset, -20vh)) translateX(0px) rotate(0deg); opacity: 0.7;} 100% { transform: translateY(120vh) translateX(100px) rotate(360deg); opacity: 0;} } @media (max-width: 768px) { .titulo-principal { font-size: 2.2rem; } .subtitulo { font-size: 1.3rem; } .titulo-seccion { font-size: 1.8rem; } .ganador-item .nombre-ganador { font-size: 1.15rem; } .ganador-item .puesto { font-size: 1rem; } .seccion-ganadores, .seccion-video, .seccion-whatsapp, .seccion-agradecimiento { padding: 20px; } } @media (max-width: 480px) { .titulo-principal { font-size: 1.9rem; } .subtitulo { font-size: 1.1rem; } .titulo-seccion { font-size: 1.6rem; } .ganador-item { padding: 12px 15px; } .ganador-item .nombre-ganador { font-size: 1.05rem; } .ganador-item .puesto { font-size: 0.9rem; } }