<commit_before><!doctype html>
<html class="no-js" lang="es" dir="ltr">
    <head>
        <meta charset="utf-8" />
        <meta http-equiv="x-ua-compatible" content="ie=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
        <title>Stylustonypro | Designed For</title>
        <link rel="icon" type="image/png" href="img/an_icon.png" />
        <link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css?family=Fira+Sans:200,900|Roboto:400,400i,700">
        <!-- <link rel="stylesheet" href="css/foundation.css"> -->
        <link rel="stylesheet" href="css/foundation.css">
        <link rel="stylesheet" href="css/app.css">
    </head>
    <body>
    <!-- Start Top Bar -->
    <!-- off-canvas title bar for 'small' screen -->

    <nav class="off-canvas position-right" id="offCanvas" data-off-canvas>
        <!-- <button class="close-button hide-for-large" aria-label="Close menu" type="button" data-close> -->
<!-- <span aria-hidden="true">&times;</span> -->
        <div class="top-bar-title flex-container tonioDisNav">
            <figure class="logo-icon"><img src="img/icon-toniodis.jpg" alt="Profile Image of tonioDis"></figure>
            <div class="my-id">
                <h1 class="my-name align-self-bottom"><NAME></h1>
                <p class="at-tonioDis">@stylustonypro</p>
            </div>
        </div>
        <div class="top-bar-left tonioDisNav">
            <ul class="vertical menu" data-magellan data-bar-offset="-26" data-animation-easing="swing" >
                <li class="tonioDisNav" data-close><a href="#Front-end"><i class="nav-icon-size fi-at-sign"></i>Web</a></li>
                <li class="tonioDisNav" data-close><a href="#Audiovisual"><i class="nav-icon-size fi-play-circle"></i>Audiovisual</a></li>
                <!-- <li class="tonioDisNav" data-close><i class="nav-icon-size fi-eye"></i><a href="#">Ads</a></li> -->
                <li class="tonioDisNav" data-close><a href="#Contact"><i class="nav-icon-size fi-torso-business"></i>Contacto</a></li>
                <li class="tonioDisNav menu-arrow" data-toggle>
                    <button class="offcanvas-trigger align-self-middle" type="button">
                        <div class="hamburger">
                            <span class="line"></span>
                            <span class="line"></span>
                        </div>
                    </button>
                </li>
            </ul>
        </div>

    </nav>
        <!-- End Top Bar -->
    <div class="off-canvas-content" data-off-canvas-content>
        <!-- Hero section -->
        <nav class="title-bar" data-responsive-toggle="widemenu" data-hide-for="large">
                <div class="row collapse small-5 align-spaced align-middle">
                    <div class="column small-3">
                    </div>
                    <div class="column small-7">
                        <div class="row">
                            <h1 class="brand">stylustonypro</h1>
                        </div>
                        <div class="row">
                            <h3 class="slogan"><b>Designed For</b></h3>
                        </div>
                    </div>
                </div>
        </nav>
        <header class="hero row small-12 align-center align-middle full-height collapse">
            <div class="column row align-center small-10 ">
                <div id="Brand-toniodis" class="row align-center show-for-large ">
                    <div class="row large-5 align-middle align-center">
                        <div class="column small-3">
                            <img src="img/an_icon.png" alt="'AN' the icon of tonioDis">
                        </div>
                        <div class="column small-7">
                            <div class="row">
                                <h1 class="brand">stylustonypro</h1>
                            </div>
                            <div class="row">
                                <h3 class="slogan"><b>Designed For</b></h3>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="row text-center small-12" data-magellan data-bar-offset="-26" data-animation-easing="swing">
                    <p class="lead">Qué tal, soy diseñador gráfico profesional luciéndose como Front-end, y les he traído hasta acá para presentarles el nuevo diseño de mi portafolio, está hecho con <a href="http://foundation.zurb.com/" target="_blank">Foundations 6.3</a> y felizmente on-line gracias a <a href="https://github.com/" target="_blank">GitHub</a></p>
                    <a data-magellan-target="about" href="#about" class="alert hollow button small">¡A ver!</a>
                </div>
            </div>
        </header>
        <!-- End Hero section -->
<!-- About Section -->
        <section id="about" data-magellan-target="about" class="About flex-container full-height  align-center align-middle">
            <div class="row align-bottom align-justify small-12 medium-10">
                <!-- tonioDis Vine vid -->
                <div class="columns small-12 medium-5 small-margin-top">
                    <!-- <iframe class="Shadows" src="https://vine.co/v/57MKXmVKup1/embed/simple" width="600" height="600" frameborder="0"></iframe><script src="https://platform.vine.co/static/scripts/embed.js"></script> -->
                </div>
                <!-- tonioiDis vine vid ends -->
                <!-- Call out¡! -->
                <div class="columns small-12 medium-7">
                    <h2 class="about-title">Diseño gráfico es comunicación visual</h2>
                    <p class="lead">Y he desarrollado mi talento gracias al periodismo, marketing, publicidad y la programación.</p>
                </div>
                <!-- Call out ends -->
            </div>
        </section>
        <!-- About Section End -->
        <!-- Portfolio Section -->
        <section id="Front-end" class="Frontend flex-container full-height align-center align-middle" data-magellan-target="Front-end">
            <div class="row collapse small-11 large-12 align-middle align-center small-margin-bottom">
                <div class="column small-12 text-center small-margin-top">

                    <!-- <div class="row small-12 align-center">
                        <div class="Icon-title column small-2">< / ></div>
                    </div> --><!-- Este es el primer icono que hice para Front-end -->

                    <h2>Front-end design</h2>
                    <p class="lead Margin-bottom-lead">Una de las últimas habilidades que aun sigo perfeccionando</p>
                </div>


<!-- El Tiempo -->
                <div class="columns small-12 medium-5 large-3">
                    <div class="image-wrapper overlay-slide-in-left">
                        <img src="img/eltiempo-cover.jpg"/>
                        <div class="image-overlay-content row align-center collapse align-middle">
                          <h3 class="column small-12">El Tiempo</h3>
                          <p class="column small-12 price">Descubre cual es la temperatura en todas las ciudade del mundo</p>
                          <div class="flex-container align-spaced align-bottom small-12">
                              <i>JS</i><i>HTML</i><i>CSS</i>
                              <a href="https://toniodis.github.io/eltiempo/" class="button" target="_blank">Live demo</a>
                          </div>
                        </div>
                    </div>
                </div>
<!-- TVify -->
                <div class="columns small-12 medium-5 large-3">
                    <div class="image-wrapper overlay-slide-in-left">
                        <img src="img/tvify-cover.jpg"/>
                        <div class="image-overlay-content row collapse align-center align-middle">
                          <h3 class="column small-12">TVify</h3>
                          <p class="column small-12 price">Encuentra todas las series de televisión y selecciona tus favoritas</p>
                          <div class="flex-container align-spaced align-bottom small-12">
                              <i>JS</i><i>HTML</i><i>CSS</i>
                              <a href="https://toniodis.github.io/tvify/" class="button" target="_blank">Live demo</a>
                          </div>
                        </div>
                    </div>
                </div>
<!-- Paraleje -->
                <div class="columns small-12 medium-5 large-3">
                    <div class="image-wrapper overlay-slide-in-left">
                        <img src="img/paralaje-cover.jpg" />
                        <div class="image-overlay-content row collapse align-center align-middle">
                            <h3 class="column small-12">Paralaje</h3>
                            <p class="column small-12 price">Establece capas que reaccionan a la posición del mouse y la inclinación en móvil</p>
                            <div class="flex-container align-spaced align-bottom small-12">
                                <i>JS</i><i>HTML</i><i>CSS</i>
                                <a href="https://toniodis.github.io/dibuplax/" class="button" target="_blank" >Live demo</a>
                            </div>
                        </div>
                    </div>
                </div>
<!-- Marvel -->
                <div class="columns small-12 medium-5 large-3">
                    <div class="image-wrapper overlay-slide-in-left">
                        <img src="img/marvel-cover.jpg" />
                        <div class="image-overlay-content row collapse align-center align-middle">
                            <h3 class="column small-12">Marvel Cards</h3>
                            <p class="column small-12 price">Arquitectura front-end para la UI de juego de cartas</p>
                            <div class="flex-container align-spaced align-bottom small-12">
                                <i>HTML</i><i>CSS</i>
                                <a href="https://toniodis.github.io/marvel-card-game/" target="_blank" class="button">Live demo</a>
                            </div>
                        </div>
                    </div>
                </div>
<!-- Brand Designer -->
                <div class="columns small-12 medium-5 large-4">
                    <div class="image-wrapper overlay-slide-in-left">
                        <img src="img/antoniodibu.jpg" />
                        <div class="image-overlay-content row collapse align-center align-middle">
                            <h3 class="column small-12">Brand Designer</h3>
                            <p class="column small-12 price">El roll del diseñador en el mercado</p>
                            <div class="flex-container align-spaced align-bottom small-12">
                                <i>JS</i><i>HTML</i><i>CSS</i>
                                <a href="https://toniodis.github.io/brand-designer/antonio.html" class="button" target="_blank">Live demo</a>
                            </div>
                        </div>
                    </div>
                </div>
<!-- MasterClass -->
                <div class="columns small-12 medium-5 large-4">
                    <div class="image-wrapper overlay-slide-in-left">
                        <img src="img/masterclass.jpg" />
                        <div class="image-overlay-content row collapse align-center align-middle">
                            <h3 class="column small-12">MasterClass</h3>
                            <p class="column small-12 price">Landing Page de esta plataforma</p>
                            <div class="flex-container align-spaced align-bottom small-12">
                                <i>WP</i><i>HTML</i><i>CSS</i>
                                <a href="http://masterclass.cl" class="button" target="_blank">Live demo</a>
                            </div>
                        </div>
                    </div>
                </div>
<!-- Zurita -->
                <div class="columns small-12 medium-12 large-4">
                    <div class="image-wrapper overlay-slide-in-left">
                        <img src="img/zurita.jpg" />
                        <div class="image-overlay-content row collapse align-center align-middle">
                            <h3 class="column small-12">Zurita</h3>
                            <p class="column small-12 price">Sitio web multilenguaje que detecta el idiona ma del navegador</p>
                            <div class="flex-container align-spaced align-bottom small-12">
                                <i>WP</i><i>HTML</i><i>CSS</i>
                                <a href="http://zurita.co/" class="button" target="_blank">Live demo</a>
                            </div>
                        </div>
                    </div>
                </div>
            </div><!--Frontend ends -->
        </section>
<!-- Audiovisuales -->
        <section id="Audiovisual" data-magellan-target="Audiovisual" class="Audiovisual flex-container full-height align-middle align-center">
            <div class="row small-collapse medium-11 align-top align-justify small-margin-bottom">
                <div class="column text-center align-center align-top small-11 medium-12 small-up-1 small-margin-top">
                    <h2>
                        Audiovisual
                    </h2>
                    <p class="lead">
                    Mis esfuerzos por convertirme en filmmaker y los últimos vídeos que realizo están en
                        <a target="_blank" href="https://www.youtube.com/user/Stylustonypro/" >
                            youtube
                        </a>
                    </p>
                </div>
                <div class="Vines column align-top large-4 medium-12">
                    <div class="row small-12 collapse align-center small-margin-top">
                        <div class="column small-11 medium-12 align-center text-center large-order-5 Margin-top">
                            <h3>
                                Colección de Vines
                            </h3>
                            <p>
                                Estas divertidas animaciones están hechas en After Effects, con una técnica que es muy buena par hacer gif y banners publicitarios.
                                Apropócito tengo más en
                                <a href="https://vine.co/toniodis" target="_blank">
                                    vine.co/toniodis
                                </a>
                            </p>
                        </div>
                        <div class="column medium-6">
                                <!-- <img src="http://placehold.it/720x720"> -->
                                <!-- <iframe src="https://vine.co/v/51jIwXAaBpI/embed/simple" width="600" height="600" frameborder="0"></iframe><script src="https://platform.vine.co/static/scripts/embed.js"></script> -->
                        </div>
                        <div class="column medium-6">
                                <!-- <img src="http://placehold.it/720x720"> -->
                                <!-- <iframe src="https://vine.co/v/55xbA5eh6aD/embed/simple" width="600" height="600" frameborder="0"></iframe><script src="https://platform.vine.co/static/scripts/embed.js"></script> -->
                        </div>
                        <div class="column medium-6">
                                <!-- <img src="http://placehold.it/720x720"> -->
                                <!-- <iframe src="https://vine.co/v/ilK7Xvr2UP3/embed/simple" width="600" height="600" frameborder="0"></iframe><script src="https://platform.vine.co/static/scripts/embed.js"></script> -->
                        </div>
                        <div class="column medium-6">
                                <!-- <img src="http://placehold.it/720x720"> -->
                                <!-- <iframe src="https://vine.co/v/57MKXmVKup1/embed/simple" width="600" height="600" frameborder="0"></iframe> -->
                                <!-- <script src="https://platform.vine.co/static/scripts/embed.js"></script> -->
                        </div>
                    </div>
                </div><!-- Vines Ends -->
                <div class="YTube column small-12 large-7 small-margin-top">
                    <div class="row column widescreen flex-video collapse align-center">
                        <!-- <iframe width="1280" height="720" src="https://www.youtube.com/embed/k0UtOcGNEzc" frameborder="0" allowfullscreen></iframe> -->
                    </div>
                    <div class="row collapse small-12 align-center text-center">
                        <h3>Play the demo reel 2016</h3>
                        <p class="column small-11">
                            Y descubre lo que motion graphic puede hacer por ti al dar vida a cualquier imagen publicitaria o informativa con la magia de la animación.
                        </p>
                    </div>
                </div>
            </div><!-- Audiovisuales ends -->
        </section><!--Ends Porfolio -->
        <!-- Portfolio Ends -->
        <!-- Footer -->
        <footer id="Contact" data-magellan-target="Contact" class="Contact row small-12 align-center full-height text-center align-middle">
            <div class="row column small-11 align-center align-stretch">
                <div class="column align-center">
                    <div class="row collapse align-center small-margin-top">
                        <h2>Estoy en toda la web, compruébalo googleando <a href="https://www.google.com/search?sxsrf=ACYBGNTh-LNGsEK10zAE1wc0iWOFMcyLsg%3A1580434018593&ei=YoIzXrL8I6fQ5OUP29WuqA8&q=stylustonypro&oq=stylustonypro&gs_l=psy-ab.3..35i39.6270.6270..7062...0.0..0.493.955.4-2......0....1..gws-wiz.S-GPjbzCh14&ved=0ahUKEwiytZPC16znAhUnKLkGHduqC_UQ4dUDCAs&uact=5" target="_blank">stylustonypro :)</a></h2><commit_msg>unhide the videos<commit_after><!doctype html>
<html class="no-js" lang="es" dir="ltr">
    <head>
        <meta charset="utf-8" />
        <meta http-equiv="x-ua-compatible" content="ie=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
        <title>Stylustonypro | Designed For</title>
        <link rel="icon" type="image/png" href="img/an_icon.png" />
        <link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css?family=Fira+Sans:200,900|Roboto:400,400i,700">
        <!-- <link rel="stylesheet" href="css/foundation.css"> -->
        <link rel="stylesheet" href="css/foundation.css">
        <link rel="stylesheet" href="css/app.css">
    </head>
    <body>
    <!-- Start Top Bar -->
    <!-- off-canvas title bar for 'small' screen -->

    <nav class="off-canvas position-right" id="offCanvas" data-off-canvas>
        <!-- <button class="close-button hide-for-large" aria-label="Close menu" type="button" data-close> -->
<!-- <span aria-hidden="true">&times;</span> -->
        <div class="top-bar-title flex-container tonioDisNav">
            <figure class="logo-icon"><img src="img/icon-toniodis.jpg" alt="Profile Image of tonioDis"></figure>
            <div class="my-id">
                <h1 class="my-name align-self-bottom"><NAME></h1>
                <p class="at-tonioDis">@stylustonypro</p>
            </div>
        </div>
        <div class="top-bar-left tonioDisNav">
            <ul class="vertical menu" data-magellan data-bar-offset="-26" data-animation-easing="swing" >
                <li class="tonioDisNav" data-close><a href="#Front-end"><i class="nav-icon-size fi-at-sign"></i>Web</a></li>
                <li class="tonioDisNav" data-close><a href="#Audiovisual"><i class="nav-icon-size fi-play-circle"></i>Audiovisual</a></li>
                <!-- <li class="tonioDisNav" data-close><i class="nav-icon-size fi-eye"></i><a href="#">Ads</a></li> -->
                <li class="tonioDisNav" data-close><a href="#Contact"><i class="nav-icon-size fi-torso-business"></i>Contacto</a></li>
                <li class="tonioDisNav menu-arrow" data-toggle>
                    <button class="offcanvas-trigger align-self-middle" type="button">
                        <div class="hamburger">
                            <span class="line"></span>
                            <span class="line"></span>
                        </div>
                    </button>
                </li>
            </ul>
        </div>

    </nav>
        <!-- End Top Bar -->
    <div class="off-canvas-content" data-off-canvas-content>
        <!-- Hero section -->
        <nav class="title-bar" data-responsive-toggle="widemenu" data-hide-for="large">
                <div class="row collapse small-5 align-spaced align-middle">
                    <div class="column small-3">
                    </div>
                    <div class="column small-7">
                        <div class="row">
                            <h1 class="brand">stylustonypro</h1>
                        </div>
                        <div class="row">
                            <h3 class="slogan"><b>Designed For</b></h3>
                        </div>
                    </div>
                </div>
        </nav>
        <header class="hero row small-12 align-center align-middle full-height collapse">
            <div class="column row align-center small-10 ">
                <div id="Brand-toniodis" class="row align-center show-for-large ">
                    <div class="row large-5 align-middle align-center">
                        <div class="column small-3">
                            <img src="img/an_icon.png" alt="'AN' the icon of tonioDis">
                        </div>
                        <div class="column small-7">
                            <div class="row">
                                <h1 class="brand">stylustonypro</h1>
                            </div>
                            <div class="row">
                                <h3 class="slogan"><b>Designed For</b></h3>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="row text-center small-12" data-magellan data-bar-offset="-26" data-animation-easing="swing">
                    <p class="lead">

                        Qué tal, soy diseñador gráfico profesional luciéndose como Front-end, y les he traído hasta acá para presentarles el nuevo diseño de mi portafolio, está hecho con <a href="http://foundation.zurb.com/" target="_blank">Foundations 6.3</a> y felizmente on-line gracias a <a href="https://github.com/" target="_blank">GitHub</a></p>
                    <a data-magellan-target="about" href="#about" class="alert hollow button small">¡A ver!</a>
                </div>
            </div>
        </header>
        <!-- End Hero section -->
<!-- About Section -->
        <section id="about" data-magellan-target="about" class="About flex-container full-height  align-center align-middle">
            <div class="row align-bottom align-justify small-12 medium-10">
                <!-- tonioDis Vine vid -->
                <div class="columns small-12 medium-5 small-margin-top">
                    <iframe class="Shadows" src="https://vine.co/v/57MKXmVKup1/embed/simple" width="600" height="600" frameborder="0"></iframe><script src="https://platform.vine.co/static/scripts/embed.js"></script>
                </div>
                <!-- tonioiDis vine vid ends -->
                <!-- Call out¡! -->
                <div class="columns small-12 medium-7">
                    <h2 class="about-title">

                        Diseño gráfico es comunicación visual</h2>
                    <p class="lead">

                        Y he desarrollado mi talento gracias al periodismo, marketing, publicidad y la programación.</p>
                </div>
                <!-- Call out ends -->
            </div>
        </section>
        <!-- About Section End -->
        <!-- Portfolio Section -->
        <section id="Front-end" class="Frontend flex-container full-height align-center align-middle" data-magellan-target="Front-end">
            <div class="row collapse small-11 large-12 align-middle align-center small-margin-bottom">
                <div class="column small-12 text-center small-margin-top">
                    <!-- <div class="row small-12 align-center">
                        <div class="Icon-title column small-2">< / ></div>
                    </div> --><!-- Este es el primer icono que hice para Front-end -->
                    <h2>Front-end design</h2>
                    <p class="lead Margin-bottom-lead">

                        Una de las últimas habilidades que aun sigo perfeccionando</p>
                </div>


<!-- El Tiempo -->
                <div class="columns small-12 medium-5 large-3">
                    <div class="image-wrapper overlay-slide-in-left">
                        <img src="img/eltiempo-cover.jpg"/>
                        <div class="image-overlay-content row align-center collapse align-middle">
                          <h3 class="column small-12">El Tiempo</h3>
                          <p class="column small-12 price">Descubre cual es la temperatura en todas las ciudade del mundo</p>
                          <div class="flex-container align-spaced align-bottom small-12">
                              <i>JS</i><i>HTML</i><i>CSS</i>
                              <a href="https://toniodis.github.io/eltiempo/" class="button" target="_blank">Live demo</a>
                          </div>
                        </div>
                    </div>
                </div>
<!-- TVify -->
                <div class="columns small-12 medium-5 large-3">
                    <div class="image-wrapper overlay-slide-in-left">
                        <img src="img/tvify-cover.jpg"/>
                        <div class="image-overlay-content row collapse align-center align-middle">
                          <h3 class="column small-12">TVify</h3>
                          <p class="column small-12 price">Encuentra todas las series de televisión y selecciona tus favoritas</p>
                          <div class="flex-container align-spaced align-bottom small-12">
                              <i>JS</i><i>HTML</i><i>CSS</i>
                              <a href="https://toniodis.github.io/tvify/" class="button" target="_blank">Live demo</a>
                          </div>
                        </div>
                    </div>
                </div>
<!-- Paraleje -->
                <div class="columns small-12 medium-5 large-3">
                    <div class="image-wrapper overlay-slide-in-left">
                        <img src="img/paralaje-cover.jpg" />
                        <div class="image-overlay-content row collapse align-center align-middle">
                            <h3 class="column small-12">Paralaje</h3>
                            <p class="column small-12 price">Establece capas que reaccionan a la posición del mouse y la inclinación en móvil</p>
                            <div class="flex-container align-spaced align-bottom small-12">
                                <i>JS</i><i>HTML</i><i>CSS</i>
                                <a href="https://toniodis.github.io/dibuplax/" class="button" target="_blank" >Live demo</a>
                            </div>
                        </div>
                    </div>
                </div>
<!-- Marvel -->
                <div class="columns small-12 medium-5 large-3">
                    <div class="image-wrapper overlay-slide-in-left">
                        <img src="img/marvel-cover.jpg" />
                        <div class="image-overlay-content row collapse align-center align-middle">
                            <h3 class="column small-12">Marvel Cards</h3>
                            <p class="column small-12 price">Arquitectura front-end para la UI de juego de cartas</p>
                            <div class="flex-container align-spaced align-bottom small-12">
                                <i>HTML</i><i>CSS</i>
                                <a href="https://toniodis.github.io/marvel-card-game/" target="_blank" class="button">Live demo</a>
                            </div>
                        </div>
                    </div>
                </div>
<!-- Brand Designer -->
                <div class="columns small-12 medium-5 large-4">
                    <div class="image-wrapper overlay-slide-in-left">
                        <img src="img/antoniodibu.jpg" />
                        <div class="image-overlay-content row collapse align-center align-middle">
                            <h3 class="column small-12">Brand Designer</h3>
                            <p class="column small-12 price">El roll del diseñador en el mercado</p>
                            <div class="flex-container align-spaced align-bottom small-12">
                                <i>JS</i><i>HTML</i><i>CSS</i>
                                <a href="https://toniodis.github.io/brand-designer/antonio.html" class="button" target="_blank">Live demo</a>
                            </div>
                        </div>
                    </div>
                </div>
<!-- MasterClass -->
                <div class="columns small-12 medium-5 large-4">
                    <div class="image-wrapper overlay-slide-in-left">
                        <img src="img/masterclass.jpg" />
                        <div class="image-overlay-content row collapse align-center align-middle">
                            <h3 class="column small-12">MasterClass</h3>
                            <p class="column small-12 price">Landing Page de esta plataforma</p>
                            <div class="flex-container align-spaced align-bottom small-12">
                                <i>WP</i><i>HTML</i><i>CSS</i>
                                <a href="http://masterclass.cl" class="button" target="_blank">Live demo</a>
                            </div>
                        </div>
                    </div>
                </div>
<!-- Zurita -->
                <div class="columns small-12 medium-12 large-4">
                    <div class="image-wrapper overlay-slide-in-left">
                        <img src="img/zurita.jpg" />
                        <div class="image-overlay-content row collapse align-center align-middle">
                            <h3 class="column small-12">Zurita</h3>
                            <p class="column small-12 price">Sitio web multilenguaje que detecta el idiona ma del navegador</p>
                            <div class="flex-container align-spaced align-bottom small-12">
                                <i>WP</i><i>HTML</i><i>CSS</i>
                                <a href="http://zurita.co/" class="button" target="_blank">Live demo</a>
                            </div>
                        </div>
                    </div>
                </div>
            </div><!--Frontend ends -->
        </section>
<!-- Audiovisuales -->
        <section id="Audiovisual" data-magellan-target="Audiovisual" class="Audiovisual flex-container full-height align-middle align-center">
            <div class="row small-collapse medium-11 align-top align-justify small-margin-bottom">
                <div class="column text-center align-center align-top small-11 medium-12 small-up-1 small-margin-top">
                    <h2>
                        Audiovisual
                    </h2>
                    <p class="lead">
                    Mis esfuerzos por convertirme en filmmaker y los últimos vídeos que realizo están en
                        <a target="_blank" href="https://www.youtube.com/user/Stylustonypro/" >
                            youtube
                        </a>
                    </p>
                </div>
                <div class="Vines column align-top large-4 medium-12">
                    <div class="row small-12 collapse align-center small-margin-top">
                        <div class="column small-11 medium-12 align-center text-center large-order-5 Margin-top">
                            <h3>
                                Colección de Vines
                            </h3>
                            <p>
                                Estas divertidas animaciones están hechas en After Effects, con una técnica que es muy buena par hacer gif y banners publicitarios.
                                Apropócito tengo más en
                                <a href="https://vine.co/toniodis" target="_blank">
                                    vine.co/toniodis
                                </a>
                            </p>
                        </div>
                        <div class="column medium-6">
                                <!-- <img src="http://placehold.it/720x720"> -->
                                <iframe src="https://vine.co/v/51jIwXAaBpI/embed/simple" width="600" height="600" frameborder="0"></iframe><script src="https://platform.vine.co/static/scripts/embed.js"></script>
                        </div>
                        <div class="column medium-6">
                                <!-- <img src="http://placehold.it/720x720"> -->
                                <iframe src="https://vine.co/v/55xbA5eh6aD/embed/simple" width="600" height="600" frameborder="0"></iframe><script src="https://platform.vine.co/static/scripts/embed.js"></script>
                        </div>
                        <div class="column medium-6">
                                <!-- <img src="http://placehold.it/720x720"> -->
                                <iframe src="https://vine.co/v/ilK7Xvr2UP3/embed/simple" width="600" height="600" frameborder="0"></iframe><script src="https://platform.vine.co/static/scripts/embed.js"></script>
                        </div>
                        <div class="column medium-6">
                                <!-- <img src="http://placehold.it/720x720"> -->
                                <iframe src="https://vine.co/v/57MKXmVKup1/embed/simple" width="600" height="600" frameborder="0"></iframe>
                                <script src="https://platform.vine.co/static/scripts/embed.js"></script>
                        </div>
                    </div>
                </div><!-- Vines Ends-->
                <div class="YTube column small-12 large-7 small-margin-top">
                    <div class="row column widescreen flex-video collapse align-center">
                        <iframe width="1280" height="720" src="https://www.youtube.com/embed/k0UtOcGNEzc" frameborder="0" allowfullscreen></iframe>
                    </div>
                    <div class="row collapse small-12 align-center text-center">
                        <h3>Play the demo reel 2016</h3>
                        <p class="column small-11">
                            
                            Y descubre lo que motion graphic puede hacer por ti al dar vida a cualquier imagen publicitaria o informativa con la magia de la animación.
                        </p>
                    </div>
                </div>
            </div><!-- Audiovisuales ends -->
        </section><!--Ends Porfolio -->
        <!-- Portfolio Ends -->
        <!-- Footer -->
        <footer id="Contact" data-magellan-target="Contact" class="Contact row small-12 align-center full-height text-center align-middle">
            <div class="row column small-11 align-center align-stretch">
                <div class="column align-center">
                    <div class="row collapse align-center small-margin-top">
                        <h2>Estoy en toda la web, compruébalo googleando <a href="https://www.google.com/search?sxsrf=ACYBGNTh-LNGsEK10zAE1wc0iWOFMcyLsg%3A1580434018593&ei=YoIzXrL8I6fQ5OUP29WuqA8&q=stylustonypro&oq=stylustonypro&gs_l=psy-ab.3..35i39.6270.6270..7062...0.0..0.493.955.4-2......0....1..gws-wiz.S-GPjbzCh14&ved=0ahUKEwiytZPC16znAhUnKLkGHduqC_UQ4dUDCAs&uact=5" target="_blank">stylustonypro :)</a></h2>
{'fraction_non_alphanumeric': 0.14187118681500704, 'fraction_numerical': 0.018883030118985174, 'mean_word_length': 1.4150943396226414, 'pattern_counts': {'":': 0, '<': 822, '<?xml version=': 0, '>': 822, 'https://': 42, 'lorem ipsum': 0, 'www.': 6, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 30, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '3649180', 'n_tokens_mistral': 10404, 'n_tokens_neox': 9657, 'n_words': 2043}