.ml3 
        	{
				font-weight: 900;
				font-size: 2.5em;
				color: #fff;
			}
			.ml4
			{
				position: relative;
				animation: mymove 5s infinite;
				animation-timing-function: ease-in;
				font-weight: 900;
				font-size: 30px;
				color: #fff
			}
			@keyframes mymove 
			{
			  from {left: 0px;}
			  to {left: 200px;}
			}
.mp3 {
  display:inline-block;
  overflow:hidden;
  white-space:nowrap;
  font-weight: 900;
				font-size: 20px;
				color: #fff
}

.mp3:first-of-type {    /* For increasing performance 
                       ID/Class should've been used. 
                       For a small demo 
                       it's okaish for now */
  animation: showup 7s infinite;
}

.mp3:last-of-type {
  width:0px;
  animation: reveal 7s infinite;
}

.mp3:last-of-type span {
  margin-left:-355px;
  animation: slidein 7s infinite;
}

@keyframes showup {
    0% {opacity:0;}
    20% {opacity:1;}
    80% {opacity:1;}
    100% {opacity:0;}
}

@keyframes slidein {
    0% { margin-left:-800px; }
    20% { margin-left:-800px; }
    35% { margin-left:0px; }
    100% { margin-left:0px; }
}

@keyframes reveal {
    0% {opacity:0;width:0px;}
    20% {opacity:1;width:0px;}
    30% {width:455px;}
    80% {opacity:1;}
    100% {opacity:0;width:455px;}
}
.center-outer {
display: table;
width: 100%;
height: 100%;
}

.center-inner {
display: table-cell;
vertical-align: middle;
text-align: center;
}
.bubbles {
display: inline-block;
font-family: arial;
position: relative;
}

.bubbles h4 {
position: relative;
margin: 1em 0 0;
font-family:'Baloo Paaji', cursive;
color: #fff;
z-index: 2;
letter-spacing:5px
background-color: rgba(255,255,255,0.5);
}

.individual-bubble {
position: absolute;
border-radius: 100%;
bottom: 10px;
background-color: #fff;
z-index: 1;
}
@media (max-width: 767px) {
    .wrap-caption h1
    {
      font-size: 16px;
    }
    .bubbles h2
    {
      font-size: 16px;
    }
    .mp3
    {
      font-size: 16px;
    }
  }
  
.footer-item .list ul li
{
  margin: 0px !important;
}