{% load static %} <!-- Load static files -->
{% load i18n %}
{% block content %}

<div class="modal fade" id="conexionProblemsMBotPillModal" tabindex="-1" role="dialog" aria-labelledby="conexionProblmesMBotPillLabel" aria-hidden="true">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-label="Close">
                	<span aria-hidden="true">&times;</span>
            	</button>
                <h3 class="modal-title" id="conexionProblemsMBotPillLabel">{% trans "Problemas para cargar el código en el Mbot" %}</h3>
            </div>
            <div class="modal-body" style="padding: 0px">
				<div id="loading_page" class="col-xs-12 loading-page">
					<div id="presentation_column" width="100%" height="100%" frameBorder="0" style="padding: 20px; max-height: 100%;">
						<div class="row" id="theory-title"  style="text-align: justify; font-size:20px;">
							<div class="col-md-12">
								<p> {% trans "Es un fastidio tener tu código perfecto para descargarlo en el Mbot y no poder hacerlo porque hay un error." %}
                  {% trans "Si tu programación es correcta toca revisar los pasos y conexiones necesarios para poder hacer tu descarga correctamente al robot Mbot. Probar sistematicamente te ayudará a resolver el problema y programar tu robot." %}
								</p>
								<div class="col-md-12 " id="theory-container">
									<h2>{% trans "Puedes  verlo en el siguiente vídeo:" %} </h2><br>
									<p style="text-align: center;">
										<iframe style="width:100%; height:50%;" src="https://www.youtube.com/embed/skX9bbdEvvw"></iframe>
									</p>
									<p style="text-align:center">{% trans "¿Tienes alguna duda? Pregunta en nuestro" %} <a href="https://foro.kibotics.org/"><strong>{% trans "Foro" %}</strong></a>
                                        <br>
                                    </p>
								</div>
							</div>
						</div>
					</div>
				</div>
            </div>
            <div class="modal-footer"></div>
        </div>
    </div>
</div>
{% endblock %}