recording 06/08

<head>
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.1/css/all.css" integrity="sha384-50oBUHEmvpQ+1lW4y57PTFmhCaXp0ML5d60M1M7uH2+nqUivzIebhndOJK28anvf" crossorigin="anonymous">
</head>

<style>

#recording { position: relative; bottom: -0.3em; z-index:500; } /* change this if you dont want it positioned */

#recording {
display: flex;
align-items: center;
background: #ffffff00;
position: absolute;
z-index: 30;
bottom: 10px;
left: 10px;
}

p3 {
display: flex;
align-items: center;
font-size: 16px;
color: #fff;
font-family: pixel;
animation:blinkingText .875s infinite;
margin: auto;
}
@keyframes blinkingText{
0%{ color: #ffffff00; }
49%{ color: #ffffff00; }
60%{ color: #abb8a5; }
99%{ color: #abb8a5; }
100%{ color: #ffffff00; }
}
</style>

<div id="recording"><text style="color:#ffffff;display: flex;
align-items: center;font-family:pixel;
font-size:11px;">&nbsp;REC<p3>&nbsp;●</p3></div>