table{
            width:100%;
        }
        .text-center{
            text-align: center;
        }
        .text-right{
            text-align: right;
        }
        .width-60{
            width:60%;
        }
        .width-80{
            width:80%;
        }
        .width-100{
            width:100%;
        }
        .ml-10{
            margin-left:10% !important;
        }
        .ml-20{
            margin-left:20% !important;
        }
        .p-x-2{
            padding : 3px;
        }
        .p-x-5{
            padding : 25px;
        }
        .font-32{
            font-size:32px;
        }
        .font-25{
            font-size:25px;
        }
        .white{
            color:#fff;
        }
        .black{
            color:#000;
        }
        .red{
            color:red !important;
        }
        .green{
            color:green;
        }
        a:hover{
            color:red;
        }
        .bold{
        font-weight: bold;
        }
        
.live {
    width: 10px;
    height: 10px;
    margin-bottom: 5px;
    border-radius:50px;
    background-color: red;
    position: relative;
    animation-name: example;
    animation-duration: 4s;
    animation-iteration-count: infinite;
    display: inline-block;
  }
  
  @keyframes example {
    0%   {width: 10px;
        height: 10px;background-color:red; }
    25%  {width: 0px;height: 0px;}
    50%  {width: 10px;
        height: 10px;background-color:red; }
    75%  {width: 0px;height: 0px;}
    100% {width: 10px;
        height: 10px;background-color:red;}
  }