<div class="d-flex flex-column align-items-center justify-content-center h-100">

	<div class="flex-fill mt-1 mb-3 w-50 align-self-end"
		 style="border-left: 2px solid #008000;border-top: 2px solid #008000; border-top-left-radius: 20px"></div>

	<div class="btn-group" role="group" aria-label="Basic radio toggle button group">
		{% for opt_value,opt_label in logic.options %}
			<input type="radio"
				   class="btn-check" name="{{ logic.name }}"
				   value="{{ opt_value }}"
				   id="{{ logic.name }}_{{ opt_value }}" autocomplete="off"
				   {% if logic.value==opt_value %}checked{% endif %}>
			<label class="btn btn-outline-primary"
				   for="{{ logic.name }}_{{ opt_value }}">{{ opt_label }}</label>
		{% endfor %}
	</div>

	<div class="flex-fill mb-1 mt-3 w-50 align-self-end"
		 style="border-left: 2px solid #008000;border-bottom: 2px solid #008000; border-bottom-left-radius: 20px"></div>
</div>