JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://rawgithub.com/johnschult/jquery.countdown360/master/dist/jquery.countdown360.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<div class="row">
  <div class="col-md-6">
    <div id="countdown"></div>
    <button class="btn btn-danger disabled">CONTINUE</button>
  </div>
</div>

CSS

.ctr {
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  position: fixed;
}

.opaq {
  opacity: .3;
}

JavaScript

$(function() {
  $("#countdown").countdown360({
    radius: 70,
    seconds: 5,
    strokeWidth: 5,
    fillStyle: '#fff',
    strokeStyle: '#003F87',
    fontSize: 50,
    fontColor: '#003F87',
    autostart: false,
    onComplete: function() {
      $("button").removeClass("disabled");
      $("#countdown").addClass("opaq");
    }
  }).start();
})