{{ block styles }}
    <link href="{{ static 'global/css/styles.css' }}" rel="stylesheet">
    <link href="{{ static 'global/css/font.css' }}" rel="stylesheet">

{{ endblock }}

{{ block scripts }}
    <script src="{{ static 'global/js/disable.js' }}"></script>
{{ endblock }}

{{ block title }}
    Survey
{{ endblock }}
{{ block content }}
    <div class="survey-container">
        <div class="likert-not-centered">
            {{ formfield 'gender' }}
        </div>
        <div class="likert-not-centered">
            {{ formfield 'education' }}
        </div>
        <div class="likert-not-centered">
            {{ formfield 'ap_familiarity' }}
            <div class="d-flex justify-content-between">
                <div class="likert-centered__label-left">
                    Not familiar at all
                </div>
                <div class="likert-centered__label-right">
                    Very much familiar
                </div>
            </div>
        </div>

        <div class="likert-not-centered">
            {{ formfield 'psat_familiarity' }}
            <div class="d-flex justify-content-between">
                <div class="likert-centered__label-left">
                    Not familiar at all
                </div>
                <div class="likert-centered__label-right">
                    Very much familiar
                </div>
            </div>
        </div>
        <p>
            <button class="otree-btn-next btn btn-primary">Submit</button>
        </p>
    </div>

{{ endblock }}