Footer for tzovar.as

footer.html

<style>
  .flag {
  -webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */
  filter: grayscale(100%);
	height: 0.7em;
  moz-border-radius: 0px;
  -webkit-border-radius: 0px;
  border-radius: 0px;
	}
</style>

<span id='json_url' href='https://my-personal-api.herokuapp.com/data/15713726/'></span>
<span id='time_info' class='invisible'>
  Bastian's local time is <i class="far fa-clock"></i> <span id='local_time'></span> (<span id='time_zone'></span>).
</span>
<span id='location_info' class='invisible'>
  He is currently in <span id='location_name'></span> <img id='flag' class='flag' src=''/> <span id='weather' class='invisible'><br/>There it is
    <i><i id='condition_icon'></i> <span id='weather_condition'></span></i> and <span id='weather_temperature'></span>˚C.</span><br/><br/>
</span>
<span id='activity_info' class='invisible'>
  His current heart rate is <i class="fas fa-heartbeat"></i> <span id='heart_rate'></span> bpm and
  he took <i class="fas fa-shoe-prints"></i> <span id='steps'></span> steps today.

  He slept <i class="fas fa-bed"></i> <span id='sleep'></span> hours.
  His phone is <i id='battery_icon'></i> <span id='battery_level'></span>% charged and is currently <span id='battery_state'></span>.<br/><br/>
</span>
<span id='music_info' class='invisible'>
  He recently danced to <i class="fas fa-music"></i> <i><span id='title'></span></i>
  by <span id='artist'></span>.<br/><br/>
</span>