{% block styles %}
<style>
     .custom-border {
        border-color: #d6d8db;
    }
 </style>
{% endblock %}
{% block title %}
{% endblock %}

{% block content %}
<div class="container bg-light border custom-border" style="padding-left:30px; padding-right:30px">
    <br>
<p>
    Please click the box below to confirm that you are not a robot.
</p>


<div class="g-recaptcha" data-sitekey="6Ld_izwoAAAAANB5cgcx190wf3VCrppLS067CzHW" data-callback="enableBtn"></div>

<p>

</p>

    <button class="otree-btn-next btn btn-primary" style="display: none">Next</button>
    <br>
</div>
{% endblock %}

{% block scripts %}

    <script>
        let otreeButton = document.getElementsByClassName("otree-btn-next btn btn-primary")[0];
        function enableBtn(){
            setTimeout(function(){otreeButton.style.display = 'block'}, 500);
        }

    </script>

<script src='https://www.google.com/recaptcha/api.js?explicit&hl=en'></script>

{% endblock %}