.updated-wrapper {
    float:left;
}

.updated {
    display: inline-block;
    margin-bottom:5px;
}

.onlineMarkerOuter {
    /* width: 30px; */
    /* height: 30px; */
    /* text-align: center; */
    padding: 6px 0 0 15px;
    /* display:inline-block; */
    float: left;
}

.loadingMarker:before {
    content: '';
    position: absolute;
    width: 8px;
    height: 8px;
    margin: 4px 0 0 -13px;
    background: #ffbe00;
    border-color: #ffbe00;
    border-radius: 50%;
}

.offlineMarker:before {
    content: '';
    position: absolute;
    width: 8px;
    height: 8px;
    margin: 4px 0 0 -13px;
    background: #ff0000;
    border-color: #ff0000;
    border-radius: 50%;
}

.onlineMarker:before {
    content: '';
    position: absolute;
    width: 8px;
    height: 8px;
    margin: 4px 0 0 -13px;
    background: #158c15;
    border-color: #158c15;
    border-radius: 50%;
}

.onlineMarker:after {
    content: '';
    position: absolute;
    width: 32px;
    height: 32px;
    margin: -8px 0 0 -25px;
    border: 1px solid #158c15;
    border-radius: 50%;
    box-shadow: 0 0 4px #158c15, inset 0 0 4px rgb(56, 111, 169);
    -webkit-transform: scale(0);
    -webkit-animation: online 2.5s ease-in-out infinite;
    animation: online 2.5s ease-in-out infinite;
}

@-webkit-keyframes online {
  0%{
    -webkit-transform:scale(.1);
    opacity:1;
  }
  70%{
    -webkit-transform:scale(2.5);
    opacity:0;
  }
  100%{
    opacity:0;
  }
}