.map { width: 734px; height: 530px; background: url('/plan.jpg'); background-size: cover; position: relative; } .mapMarker { position: absolute; left: 25%; top: 33%; } .mapMarker svg { color: #dc3545; font-size: 2rem; cursor: pointer; } .mapMarker.selected svg { color: #007bff; animation: bounce 0.7s ease 5; } @keyframes bounce{ from {margin-top: 0;} 50% {margin-top: 8px;} to {margin-top: 0;} } .vegetables--types--group li { cursor: pointer; text-align: left; } .vegetables--types--group li:hover { background: #fafafa; opacity: 0.6; } .vegetables--types--group li.selected { background: #f1f1f1; font-weight: bold; } .vegetables--types--group .badge { margin-left: 8px; }