{% extends 'CmBundle:Z:baseDos.html.twig' %}

{% block metas %}
    <meta http-equiv="content-type" content="application/vnd.ms-excel; charset=UTF-8">
{% endblock %}

{% block stylesheet %}
    <style>
        hr{
            margin-bottom: 5px;
            margin-top: 5px;
        }
        .zoom{
            /* Aumentamos la anchura y altura durante 2 segundos */
            transition: width 1s, height 1s, transform 1s;
            -moz-transition: width 1s, height 1s, -moz-transform 1s;
            -webkit-transition: width 1s, height 1s, -webkit-transform 1s;
            -o-transition: width 1s, height 1s,-o-transform 1s;
        }
        .zoom:hover{
            /* tranformamos el elemento al pasar el mouse por encima al doble de
               su tamaño con scale(2). */
            transform : scale(4);
            -moz-transform : scale(4);      /* Firefox */
            -webkit-transform : scale(4);   /* Chrome - Safari */
            -o-transform : scale(4);        /* Opera */
        }
        .atras:hover{
            background-color: lightskyblue !important;
        }
        .atras:hover a{
            background-color: lightskyblue !important;
            color: white !important;
        }
    </style>
{% endblock %}

{% block javascripts %}
    <script src="{{asset('js/excel/tableToExcel.js')}}"></script>
    <script src="{{asset('js/misJs/direccionGeneral.js')}}"></script>
{% endblock %}

{% block content %}
    {#<div class="row">
        <div class="col-lg-12" style="padding-left: 0px;padding-right: 0px;">
            <h3 class="text-center">
                Bienvenido al sistema!!!
            </h3>
        </div>
    </div><!-- FIN DIV ROW -->
    #}
    <div class="row" id="contenedorDG" style="padding-top: 5px;">
        <div class="col-lg-3 col-md-6">
            <div class="panel panel-green">
                <div class="panel-heading">
                    <div class="row">
                        <div class="col-xs-3">
                            <i class="fa fa-database fa-5x"></i>
                        </div>
                        <div class="col-xs-9 text-right">
                            <div class="huge">*</div>
                            <div>Base General</div>
                        </div>
                    </div>
                </div>
                <a href="#" onclick="validar(1);">
                    <div class="panel-footer" style="background-color: white;">
                        <span class="pull-left">Detalles</span>
                        <span class="pull-right"><i class="fa fa-arrow-circle-right"></i></span>
                        <div class="clearfix"></div>
                    </div>
                </a>
            </div>
        </div>
        <div class="col-lg-3 col-md-6 hidden">
            <div class="panel panel-primary">
                <div class="panel-heading">
                    <div class="row">
                        <div class="col-xs-3">
                            <i class="fa fa-file-text fa-5x"></i>
                        </div>
                        <div class="col-xs-9 text-right">
                            <div class="huge">*</div>
                            <div>Maestría</div>
                        </div>
                    </div>
                </div>
                <a href="#" onclick="validar(2);">
                    <div class="panel-footer" style="background-color: white;">
                        <span class="pull-left">Detalles</span>
                        <span class="pull-right"><i class="fa fa-arrow-circle-right"></i></span>
                        <div class="clearfix"></div>
                    </div>
                </a>
            </div>
        </div>
        <div class="col-lg-3 col-md-6 hidden">
            <div class="panel panel-red">
                <div class="panel-heading">
                    <div class="row">
                        <div class="col-xs-3">
                            <i class="fa fa-clipboard fa-5x"></i>
                        </div>
                        <div class="col-xs-9 text-right">
                            <div class="huge">*</div>
                            <div>Doctorado</div>
                        </div>
                    </div>
                </div>
                <a href="#" onclick="validar(3);">
                    <div class="panel-footer" style="background-color: white;">
                        <span class="pull-left">Detalles</span>
                        <span class="pull-right"><i class="fa fa-arrow-circle-right"></i></span>
                        <div class="clearfix"></div>
                    </div>
                </a>
            </div>
        </div>
        <div class="col-lg-3 col-md-6">
            <div class="panel panel-yellow">
                <div class="panel-heading">
                    <div class="row">
                        <div class="col-xs-3">
                            <i class="fa fa-file-o fa-5x"></i>
                        </div>
                        <div class="col-xs-9 text-right">
                            <div class="huge">E. U.</div>
                            <div>Bachillerato</div>
                        </div>
                    </div>
                </div>
                <a href="#" onclick="validar(4);">
                    <div class="panel-footer" style="background-color: white;">
                        <span class="pull-left">Detalles</span>
                        <span class="pull-right"><i class="fa fa-arrow-circle-right"></i></span>
                        <div class="clearfix"></div>
                    </div>
                </a>
            </div>
        </div>
        <div class="col-lg-3 col-md-6">
            <div class="panel panel-morado">
                <div class="panel-heading">
                    <div class="row">
                        <div class="col-xs-3">
                            <i class="fa fa-file-text-o fa-5x"></i>
                        </div>
                        <div class="col-xs-9 text-right">
                            <div class="huge">*</div>
                            <div>Titulación</div>
                        </div>
                    </div>
                </div>
                <a href="#" onclick="validar(5);">
                    <div class="panel-footer" style="background-color: white;">
                        <span class="pull-left">Detalles</span>
                        <span class="pull-right"><i class="fa fa-arrow-circle-right"></i></span>
                        <div class="clearfix"></div>
                    </div>
                </a>
            </div>
        </div>
        <div class="col-lg-3 col-md-6 hidden">
            <div class="panel panel-amarillo">
                <div class="panel-heading">
                    <div class="row">
                        <div class="col-xs-3">
                            <i class="fa fa-files-o fa-5x"></i>
                        </div>
                        <div class="col-xs-9 text-right">
                            <div class="huge">*</div>
                            <div>Diplomados / Otros</div>
                        </div>
                    </div>
                </div>
                <a href="#" onclick="validar(6);">
                    <div class="panel-footer" style="background-color: white;">
                        <span class="pull-left">Detalles</span>
                        <span class="pull-right"><i class="fa fa-arrow-circle-right"></i></span>
                        <div class="clearfix"></div>
                    </div>
                </a>
            </div>
        </div>
    </div><!-- FIN DIV ROW CONTENEDOR DG-->

{% endblock %}