:root{
        --light-pink: #fde2f5;
        --dark-pink:#c61190;
        --light-blue:#eff7ff;
        --light-black:#414141;

         --font-weight-100: 100;
        --font-weight-200: 200;
        --font-weight-300: 300;
        --font-weight-400: 400;
        --font-weight-500: 500;
        --font-weight-600: 600;
        --font-weight-700: 700;
        --font-weight-800: 800;
        --font-weight-900: 900;
        --font-weight-bold: bold;
        --font-weight-bolder: bolder;


        --font-family-base: "Poppins", sans-serif;
        --font-size-base: 1rem;
        --font-size-sm: 0.875rem;
        --font-size-lg: 1.05rem;
        --font-size-12px: 0.75rem;
      }

        .notification-panel {
            width: 100%;
            background: #745B00;
            overflow: hidden;
            display: flex;
            align-items: center;
        }

        .ticker-container {
            flex: 1;
            overflow: hidden;
            position: relative;
            display: flex;
            align-items: center;
        }

        .ticker-wrap {
            display: flex;
            white-space: nowrap;
        }

        .ticker-item {
            display: inline-flex;
            align-items: center;
            padding: 0 40px;
            font-size: 16px;
            color: #333;
            white-space: nowrap;
        } 

        /* .ticker-item::after {
            content: '•';
            margin-left: 40px;
            color: #f5576c;
            font-size: 24px;
            font-weight: bold;
        } */

        .ticker-item a{
            color: #fff;
            font-size: 1.7rem;
            padding: 0.6rem 0rem;
            text-decoration: none;
        }

        @keyframes ring {
            0%, 100% {
                transform: rotate(0deg);
            }
            10%, 30% {
                transform: rotate(-10deg);
            }
            20%, 40% {
                transform: rotate(10deg);
            }
            50% {
                transform: rotate(0deg);
            }
        }

        .ticker-wrap:hover {
            animation-play-state: paused;
        }

        @media (max-width: 768px) {
            .notification-label {
                padding:7px 8px;
                font-size: var(--font-size-12px);
            }

            .ticker-item {
                font-size: 14px;
                padding: 0 30px;
            }
            .ticker-item a{
                color: #fff;
                font-size: 1rem;
                text-decoration: none;
                padding: 0.6rem 0rem;
            }
        }