Add Red Pulsing Dot on Menu Item

Using this brings attention to a menu item you want your customers to click on. Add this to your custom css.

Be sure to change the menu item number to match what your menu item number is. Adjust the “top” and the “left” tags as needed on your site.

/*RED PULSING DOT*/
.menu-item-262:before {
    content: '';
    display: block;
    position: absolute;
    top: 5px;
    left: -10px;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #ff0932;
    box-shadow: 0 0 0 0 rgba(255,255,255,.2);
    animation: pulse 2s infinite;
    z-index: 999;
}

@media (max-width: 767px){
	.menu-item-262:before {
    content: '';
    display: block;
    position: absolute;
    top: 7px;
    left: 10px;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #ff0932;
    box-shadow: 0 0 0 0 rgba(255,255,255,.2);
    animation: pulse 2s infinite;
    z-index: 999;
}
}

@keyframes pulse
{
     0% {
          box-shadow: 0 0 0 0px rgba(0, 0, 0, 0.2);
     }
     100% {
          box-shadow: 0 0 0 20px rgba(0, 0, 0, 0);
     }
}