JeanBenitez
/
PlataformaEducativa


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389
							<!doctype html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <!-- styles -->
    <link rel="stylesheet" type="text/css" href="css/bootstrap.css" />
    <link rel="stylesheet" href="css/style-main.css">
    <link rel="stylesheet" href="css/style.css">
    <link rel="stylesheet" href="css/responsive.css">
    <link rel="stylesheet" href="css/icons-platform.css">
    <link rel="stylesheet" href="css/fontawesome/css/all.css">
    <link rel="stylesheet" href="css/animations.css">
    <link rel="stylesheet" href="css/animation-main.css">
    <link rel="stylesheet" href="css/loading.css">
    <link rel="stylesheet" href="css/arrows.css">
    <link rel="stylesheet" href="css/texto-principal.css">
    <link rel="stylesheet" href="css/style-p.css">
    <link rel="stylesheet" href="css/texto-style.css">


    <script src="https://code.jquery.com/jquery-1.10.1.min.js"></script>


    <title> Plataforma Educativa </title>
    <!-- Para FTP -->
    <script async src="https://www.googletagmanager.com/gtag/js?id=UA-46001212-3"></script>
    <script>
        window.dataLayer = window.dataLayer || [];

        function gtag() {
            dataLayer.push(arguments);
        }
        gtag('js', new Date());
        gtag('config', 'UA-46001212-3');
    </script>
</head>

<body>
    <div class="covid19">
        <div class="background-top2">
            <nav class="navbar navbar-expand-lg">
                <div class="container-fluid row">
                    <div class="col-md-3 col-12 col-sm-12 ocultar">
                        <div class="row">
                            <div class="col-md-6 col-sm-6 col-6">
                                <a class="navbar-brand" href="index">
                                    <!-- No poner contenido -->
                                </a>
                            </div>
                            <div class="col-md-6 col-sm-6 col-6 text-right p-rt">
                                <button class="navbar-toggler whitee" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
                                    <i class="fas fa-bars"></i>
                                </button>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-12 col-12 col-sm-12 mostrar">
                        <div class="row">
                            <div class="col-md-6 col-sm-6 col-6">
                                <a class="navbar-brand" href="index">
                                    <!-- No poner contenido -->
                                </a>
                            </div>
                            <div class="col-md-6 col-sm-6 col-6 text-right p-rt">
                                <button class="navbar-toggler whitee" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
                                    <i class="fas fa-bars"></i>
                                </button>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-9 col-12 col-sm-12">
                        <div class="collapse navbar-collapse" id="navbarSupportedContent">
                            <ul class="navbar-nav ml-auto menu-to">
                                <li class="nav-item2">
                                    <a class="nav-link underline-no" href="index"> Inicio </a>
                                </li>
                                <li class="nav-item2">
                                    <a class="nav-link underline-no" href="conocenos"> Conócenos </a>
                                </li>
                                <li class="nav-item2">
                                    <a class="nav-link underline-no" href="funciones"> Funciones </a>
                                </li>
                                <li class="nav-item2">
                                    <a class="nav-link underline-no" href="contacto"> Contacto </a>
                                </li>
                                <li class="nav-item2 d-flex justify-content-center">
                                    <a id="covid" class="covid slideDown white-button" href="apoyo-covid-19">Apoyo COVID-19</a>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>
            </nav>
            <div class="relleno">
                <div class="row row-c">
                    <div class="col-md-5 col-sm-12 col-12 d-flex align-items-center display-m">
                        <br>
                        <ul class="puntos-index li-no">
                            <li>Fácil administración de tu colegio</li>
                            <li>Carga de información rápida y sencilla</li>
                            <li>Conoce nuestra app móvil</li>
                            <li>Plataforma flexible</li>
                        </ul>
                        <!-- <ul class="puntos-index li-no">
                            <li>
                                <div class="div pr-1">Facil</div>
                                <div class="div">
                                    <span> administración de tu colegio</span>
                                </div>
                            </li>
                            <li>
                                <div class="div pr-1">Carga</div>
                                <div class="div ">
                                    <span> de información rápida y sencilla</span>
                                </div>
                            </li>
                            <li>
                                <div class="div pr-1">Conoce</div>
                                <div class="div ">
                                    <span> nuestra app móvil</span>
                                </div>
                            </li>
                            <li>
                                <div class="div pr-1">Plataforma</div>
                                <div class="div ">
                                    <span> flexible</span>
                                </div>
                            </li> -->
                        </ul>
                    </div>
                    <div class="col-md-7 col-sm-12 col-12 d-flex align-items-end display-m">
                        <div id="dialogo-1" class="dialogo-1 flotando-d">
                            <img width="30%" src="img/index/animacion-index/dialogo.png" alt="Fondo2">
                        </div>
                        <div id="dialogo-2" class="dialogo-2 flotando-d1">
                            <img width="30%" src="img/index/animacion-index/dialogo2.png" alt="Fondo2">
                        </div>
                        <div id="avion" class="avion flotando-a">
                            <img width="30%" src="img/index/animacion-index/avion.png" alt="Fondo2">
                        </div>
                        <div id="lapiz" class="lapiz flotando-l">
                            <img width="30%" src="img/index/animacion-index/lapiz.png" alt="Fondo2">
                        </div>
                        <div id="foco" class="foco">
                            <img width="60%" src="img/index/animacion-index/foco.gif" alt="Fondo3">
                        </div>
                        <div id="libro" class="libro">
                            <img width="100%" src="img/index/animacion-index/libro.png" alt="Fondo2">
                        </div>
                    </div>
                    <div class="col-md-12 col-sm-12 col-12 d-flex align-items-end display-t text-center">
                        <div class="container text-center">
                            <div id="dialogo-1" class="dialogo-1 flotando-d">
                                <img width="30%" src="img/index/animacion-index/dialogo.png" alt="Fondo2">
                            </div>
                            <div id="dialogo-2" class="dialogo-2 flotando-d1">
                                <img width="30%" src="img/index/animacion-index/dialogo2.png" alt="Fondo2">
                            </div>
                            <div id="avion" class="avion flotando-a">
                                <img width="30%" src="img/index/animacion-index/avion.png" alt="Fondo2">
                            </div>
                            <div id="lapiz" class="lapiz flotando-l">
                                <img width="30%" src="img/index/animacion-index/lapiz.png" alt="Fondo2">
                            </div>
                            <div id="foco" class="foco">
                                <img width="60%" src="img/index/animacion-index/foco.gif" alt="Fondo3">
                            </div>
                            <div id="libro" class="libro">
                                <img width="100%" src="img/index/animacion-index/libro.png" alt="Fondo2">
                            </div>
                        </div>
                    </div>
                    <div class="col-md-12 col-sm-12 col-12 display-t">
                        <div class="row container-fluid margin-te pa">
                            <div class="col-md-6 col-sm-12 col-12 text-center m-text">
                                <p class="puntos-index2">Fácil administración de tu colegio</p>
                            </div>
                            <div class="col-md-6 col-sm-12 col-12 text-center m-text">
                                <p class="puntos-index2">Carga rápida y flexible</p>
                            </div>
                            <div class="col-md-6 col-sm-12 col-12 text-center m-text">
                                <p class="puntos-index2">Carga rápida y sencilla</p>
                            </div>
                            <div class="col-md-6 col-sm-12 col-12s text-center m-text">
                                <p class="puntos-index2">Conoce nuestra app móvil</p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="separator pt-1">
                <img width="100%" height="100%" src="img/index/Separador1_10.png" alt="Separador">
            </div>
            <div class="back-azul padding-fluid">
                <div class="row padding-div d-flex align-items-center">
                    <div id="texto-0" class="col-md-6">
                        <h1 class="title">Clases en línea</h1>
                        <p class="description padding">Programa las sesiones e imparte videoconferecias con hasta 100 alumnos. Graba las sesiones, comparte tu pantalla, escribe en la pizarra, interactúa en video con los participantes o utiliza el chat en vivo de las reuniones. Nuestra
                            solución todo en uno te permite realizar múltiples sesiones simultáneas, evita que contrates otros servicios de streaming y lo mejor de todo, tu informaciónes completamente privada.</p>
                    </div>
                    <div class="col-md-6">
                        <img class="img-fluid" src="img/zero/Animacion_00000.png" alt="Clases en línea">
                    </div>
                </div>
            </div>
            <div class="separator">
                <img width="100%" height="100%" src="img/index/Separador1_10.png" alt="Separador">
            </div>
            <div class="back-azulf padding-fluid">
                <div class="row padding-div d-flex align-items-center">
                    <div class="col-md-6">
                        <img class="img-fluid img-max" src="img/first/animacion 90.png" alt="Clases en línea">
                    </div>
                    <div id="texto" class="col-md-6">
                        <h1 class="title">Circulares digitales</h1>
                        <p class="description padding">Optimiza la comunicación entre alumnos, profesores y padres de familia, enviando circulares electrónicas de actividades y eventos.</p>
                    </div>
                </div>
            </div>
            <div class="separator">
                <img width="100%" height="100%" src="img/index/Separador1_10.png" alt="Separador">
            </div>
            <div class="back-rojo padding-fluid">
                <div class="row padding-div d-flex align-items-center">
                    <div id="texto-1" class="col-md-6">
                        <h1 class="title">Administración de Tareas</h1>
                        <p class="description padding">Los profesores pueden asignar tareas que son consultadas por alumnos y padres de familia. A través del sistema, el alumno mantiene un control de las tareas que ha completado y de aquellos que tiene por realizar. La programación
                            de tareas permite incluir adjuntos de gran tamaño y vínculos directos a los contenidos, para el caso de los videos.</p>
                    </div>
                    <div class="col-md-6 d-flex align-items-center">
                        <img class="img-fluid img-max" src="img/second/TR 40.png" alt="Clases en línea">
                    </div>
                </div>
            </div>
            <div class="separator">
                <img width="100%" height="100%" src="img/index/Separador1_10.png" alt="Separador">
            </div>
            <div class="back-morado padding-fluid">
                <div class="row padding-div d-flex align-items-center">
                    <div class="col-md-6">
                        <img class="img-fluid img-max" src="img/third/Calendar10.png" alt="Clases en línea">
                    </div>
                    <div id="texto-2" class="col-md-6">
                        <h1 class="title">Calendario de actividades</h1>
                        <p class="description padding">Planifica las actividades del Colegio a lo largo del ciclo escolarde forma unificada.</p>
                    </div>
                </div>
            </div>
            <div class="separator">
                <img width="100%" height="100%" src="img/index/Separador1_10.png" alt="Separador">
            </div>
            <div class="back-verde padding-fluid">
                <div class="row padding-div d-flex align-items-center">
                    <div id="texto-3" class="col-md-6">
                        <h1 class="title">Centro de Mensajes</h1>
                        <p class="description padding">Permite la comunicación directa entre alumnos, profesores, padres de familia y directivos sin necesidad de un correo electrónico. Esta función permite el intercambio de información por equipos sin necesidad de reuniones presenciales
                            en casa.</p>
                    </div>
                    <div class="col-md-6">
                        <img class="img-fluid img-max2" src="img/fourth/Compu anima10.png" alt="Clases en línea">
                    </div>
                </div>
            </div>
            <div class="separator">
                <img width="100%" height="100%" src="img/index/Separador1_10.png" alt="Separador">
            </div>
            <div class="back-amarillo padding-fluid">
                <div class="row padding-div d-flex align-items-center">
                    <div class="col-md-6">
                        <img class="img-fluid img-max2" src="img/fifth/Tablero anima10.png" alt="Clases en línea">
                    </div>
                    <div id="texto-4" class="col-md-6">
                        <h1 class="title">Centro de Recursos por Materia</h1>
                        <p class="description padding">Los alumnos pueden acceder al contenido de cada materia y descargarlos contenidos que sus profesores compartan con ellos para su aprendizaje educativo, el sistema está diseñado para archivos adjuntos de gran tamaño y el almacenamiento
                            es ilimitado.</p>
                    </div>
                </div>
            </div>
            <div class="separator">
                <img width="100%" height="100%" src="img/index/Separador1_10.png" alt="Separador">
            </div>

            <!-- Footer -->
            <?php include('footer.html'); ?>
            <!-- Fin Footer -->
            
        </div>
    </div>

    <script type="text/javascript" src="js/bootstrap.js"></script>

    <script>
        var body = document.body;
        var contMsg1 = 0;
        var contMsg2 = 0;
        var contMsg3 = 0;
        body.scrollTop += 10;
        var cont = 1;

        $('#covid').addClass('pulse');

        var scrolled = 1;
        var value = 0;
        var signo = 1;

        function isMobile() {
            return (
                (navigator.userAgent.match(/Android/i)) ||
                (navigator.userAgent.match(/webOS/i)) ||
                (navigator.userAgent.match(/iPhone/i)) ||
                (navigator.userAgent.match(/iPod/i)) ||
                (navigator.userAgent.match(/iPad/i)) ||
                (navigator.userAgent.match(/BlackBerry/i))
            );
        }
        if (isMobile()) {
            $('#menu-bottom').remove();
            $('#footer-part-1').css({
                'margin-top': '70px'
            });
            $('#cam1').remove();
            $('#cam2').remove();
            $('#cam3').remove();
            $('#doc1').remove();
            $('#doc2').remove();
            $('#doc3').remove();
            $('#book1').remove();
            $('#book2').remove();
            $('#book3').remove();
            $('#book4').remove();
            $('#copo1').remove();
            $('#copo2').remove();
            $('#hoja1').remove();
            $('#msg1').remove();
            $('#msg2').remove();
            $('#msg3').remove();
            $('#dcl1').remove();
            $('#dcl2').remove();
            $('#dcl3').remove();
            $('#dot1').remove();
            $('#dot2').remove();
            $('#plus2').remove();
            $('#plus1s0').css({
                'margin-left': ($(window).width() * 0.3)
            });
            $('#plus1s2').css({
                'margin-left': ($(window).width() * 0.001)
            });
            $('#plus2s2').css({
                'margin-left': ($(window).width() * 0.4)
            });
            $('#plus3s2').css({
                'margin-left': ($(window).width() * -0.4)
            });
            $('#plus1s3').css({
                'margin-left': ($(window).width() * 0.4)
            });
            $('#plus2s3').css({
                'margin-left': ($(window).width() * -0.4)
            });
            $('#plus1s4').css({
                'margin-left': ($(window).width() * 0.35)
            });
            $('#plus2s4').css({
                'margin-left': ($(window).width() * -0.2)
            });
            $('#plus1s5').css({
                'margin-left': ($(window).width() * 0.1)
            });
            $('#plus2s5').css({
                'margin-left': ($(window).width() * -0.25)
            });
            $('.header').css({
                'background': 'rgba(255, 255, 255, 0.5)'
            });
            $('#link1').removeClass('white');
            $('#link1').addClass('strong-blue');
            $('#link2').removeClass('white');
            $('#link2').addClass('strong-blue');
            $('#link3').removeClass('white');
            $('#link3').addClass('strong-blue');
            $('#link4').removeClass('white');
            $('#link4').addClass('strong-blue');
            $('#covid').removeClass('white-button');
            $('#covid').addClass('strong-blue-button');
            $('#menu').removeClass('hide')
        }
        $(window).scroll(function() {
            var topOfWindow = $(window).scrollTop();
            var barra = $(window).scrollTop();
            var barra = $(window).scrollTop();
            var ventanaAncho = $(window).width();
            var escala1 = 15 + (barra / 10);
            var escala2 = -21 + (barra / 5);
            var escala3 = -21 - (barra / 15);
            var posicionDoc1 = 1000 - (barra * 0.35) + 150;
            var posicionDoc1X = ventanaAncho * 0.60;
            var posicionDoc2 = 250 - (barra * 0.35) + 250;
            var posicionDoc2X = ventanaAncho * 0.75;
            var posicionDoc3 = 900 - (barra * 0.35) + 250;
            var posicionDoc3X = ventanaAncho * 0.65;
            var posicionDot1 = -360 + (barra * 0.50) - 250;
            var posicionDot1X = ventanaAncho * 0.05;
            var posicionDot2 = -280 + (barra * 0.50) - 250;
            var posicionDot2X = ventanaAncho * 0.87;
            var posicionPlus1 = -180 + (barra * 0.50) - 250;
            var posicionPlus1X = ventanaAncho * 0.375;
            var posicionPlus2 = -100 + (barra * 0.50) - 250;
            var posicionPlus2X = ventanaAncho * 0.65;
            if (posicionDoc1 >= 360) {
                $('#doc1').css({
                    'transform': 'translateX(' + posicionDoc1X + 'px) rotate(15deg) translateY(' + posicionDoc1 + 'px)'
                });
                $('#doc1').css({
                    'width': '100px'
                });
            } else {
                var posicionDoc1Tmp = 60 + (barra * 0.35);
                var ancho1 = 100 + (barra / 100);
                $('#doc1').css({
                    'width': ancho1 + 'px'
                });
                $('#doc1').css({
                    'transform': 'translateX(' + posicionDoc1X + 'px) rotate(15deg) translateY(' + posicionDoc1Tmp + 'px)'
                });
            }
            if (posicionDoc3 >= 360) {
                $('#doc3').css({
                    'transform': 'translateX(' + posicionDoc3X + 'px) rotate(-20deg) translateY(' + posicionDoc3 + 'px)'
                });
                $('#doc3').css({
                    'width': '70px'
                });
            } else {
                var ancho3 = 70 + (barra / 120);
                var posicionDoc3Tmp = 60 + (barra * 0.35);
                $('#doc3').css({
                    'width': ancho3 + 'px'
                });
                $('#doc3').css({
                    'transform': 'translateX(' + posicionDoc3X + 'px) rotate(-20deg) translateY(' + posicionDoc3Tmp + 'px)'
                });
            }
            $('#doc2').css({
                'transform': 'translateX(' + posicionDoc2X + 'px) rotate(-20deg) translateY(' + posicionDoc2 + 'px)'
            });
            $('#dot1').css({
                'transform': 'translateX(' + posicionDot1X + 'px) translateY(' + posicionDot1 + 'px)'
            });
            $('#dot2').css({
                'transform': 'translateX(' + posicionDot2X + 'px) translateY(' + posicionDot2 + 'px)'
            });
            $('#plus1').css({
                'transform': 'translateX(' + posicionPlus1X + 'px) translateY(' + posicionPlus1 + 'px)'
            });
            $('#plus2').css({
                'transform': 'translateX(' + posicionPlus2X + 'px) translateY(' + posicionPlus2 + 'px)'
            });
            $('#img-source-0').each(function() {
                var imagePos = $(this).offset().top;
                if (imagePos < topOfWindow + 450) {
                    $(this).attr("src", "img/zero/Animacion_00007.png");
                }
                if (imagePos < topOfWindow + 435) {
                    $(this).attr("src", "img/zero/Animacion_00008.png");
                }
                if (imagePos < topOfWindow + 420) {
                    $(this).attr("src", "img/zero/Animacion_00009.png");
                }
                if (imagePos < topOfWindow + 405) {
                    $(this).attr("src", "img/zero/Animacion_00010.png");
                }
                if (imagePos < topOfWindow + 390) {
                    $(this).attr("src", "img/zero/Animacion_00011.png");
                }
                if (imagePos < topOfWindow + 375) {
                    $(this).attr("src", "img/zero/Animacion_00012.png");
                }
                if (imagePos < topOfWindow + 360) {
                    $(this).attr("src", "img/zero/Animacion_00014.png");
                }
                if (imagePos < topOfWindow + 345) {
                    $(this).attr("src", "img/zero/Animacion_00015.png");
                }
                if (imagePos < topOfWindow + 330) {
                    $(this).attr("src", "img/zero/Animacion_00017.png");
                }
                if (imagePos < topOfWindow + 315) {
                    $(this).attr("src", "img/zero/Animacion_00018.png");
                }
                if (imagePos < topOfWindow + 300) {
                    $(this).attr("src", "img/zero/Animacion_00020.png");
                }
                if (imagePos < topOfWindow + 285) {
                    $(this).attr("src", "img/zero/Animacion_00021.png");
                }
                if (imagePos < topOfWindow + 270) {
                    $(this).attr("src", "img/zero/Animacion_00022.png");
                }
                if (imagePos < topOfWindow + 255) {
                    $(this).attr("src", "img/zero/Animacion_00024.png");
                }
                if (imagePos < topOfWindow + 240) {
                    $(this).attr("src", "img/zero/Animacion_00025.png");
                }
                if (imagePos < topOfWindow + 225) {
                    $(this).attr("src", "img/zero/Animacion_00027.png");
                }
                if (imagePos < topOfWindow + 210) {
                    $(this).attr("src", "img/zero/Animacion_00028.png");
                }
                if (imagePos < topOfWindow + 195) {
                    $(this).attr("src", "img/zero/Animacion_00030.png");
                }
                if (imagePos < topOfWindow + 180) {
                    $(this).attr("src", "img/zero/Animacion_00031.png");
                }
                if (imagePos < topOfWindow + 165) {
                    $(this).attr("src", "img/zero/Animacion_00032.png");
                }
                if (imagePos < topOfWindow + 150) {
                    $(this).attr("src", "img/zero/Animacion_00033.png");
                }
                if (imagePos < topOfWindow + 135) {
                    $(this).attr("src", "img/zero/Animacion_00034.png");
                }
                if (imagePos < topOfWindow + 120) {
                    $(this).attr("src", "img/zero/Animacion_00036.png");
                }
                if (imagePos < topOfWindow + 105) {
                    $(this).attr("src", "img/zero/Animacion_00038.png");
                }
                if (imagePos < topOfWindow + 90) {
                    $(this).attr("src", "img/zero/Animacion_00039.png");
                }
                if (imagePos < topOfWindow + 75) {
                    $(this).attr("src", "img/zero/Animacion_00040.png");
                }
                if (imagePos < topOfWindow + 60) {
                    $(this).attr("src", "img/zero/Animacion_00041.png");
                }
                if (imagePos < topOfWindow + 45) {
                    $(this).attr("src", "img/zero/Animacion_00042.png");
                }
                if (imagePos < topOfWindow + 30) {
                    $(this).attr("src", "img/zero/Animacion_00043.png");
                }
            });
            $('#img-source-1').each(function() {
                var imagePos = $(this).offset().top;
                if (imagePos < topOfWindow + 600) {
                    $(this).attr("src", "img/first/animacion r10.png");
                }
                if (imagePos < topOfWindow + 580) {
                    $(this).attr("src", "img/first/h10.png");
                }
                if (imagePos < topOfWindow + 540) {
                    $(this).attr("src", "img/first/h20.png");
                }
                if (imagePos < topOfWindow + 520) {
                    $(this).attr("src", "img/first/h30.png");
                }
                if (imagePos < topOfWindow + 500) {
                    $(this).attr("src", "img/first/h40.png");
                }
                if (imagePos < topOfWindow + 480) {
                    $("#img-source-1").attr("src", "img/first/h50.png");
                }
                if (imagePos < topOfWindow + 460) {
                    $(this).attr("src", "img/first/h60.png");
                }
                if (imagePos < topOfWindow + 440) {
                    $(this).attr("src", "img/first/h70.png");
                }
                if (imagePos < topOfWindow + 420) {
                    $(this).attr("src", "img/first/h80.png");
                }
                if (imagePos < topOfWindow + 400) {
                    $(this).attr("src", "img/first/h90.png");
                }
                if (imagePos < topOfWindow + 380) {
                    $(this).attr("src", "img/first/h100.png");
                }
                if (imagePos < topOfWindow + 360) {
                    $("#img-source-1").attr("src", "img/first/h110.png");
                }
                if (imagePos < topOfWindow + 340) {
                    $(this).attr("src", "img/first/h120.png");
                }
                if (imagePos < topOfWindow + 320) {
                    $(this).attr("src", "img/first/h130.png");
                }
                if (imagePos < topOfWindow + 300) {
                    $(this).attr("src", "img/first/h140.png");
                }
                if (imagePos < topOfWindow + 280) {
                    $(this).attr("src", "img/first/h150.png");
                }
                if (imagePos < topOfWindow + 260) {
                    $(this).attr("src", "img/first/h160.png");
                }
                if (imagePos < topOfWindow + 240) {
                    $(this).attr("src", "img/first/h170.png");
                }
                if (imagePos < topOfWindow + 220) {
                    $(this).attr("src", "img/first/h180.png");
                }
                if (imagePos < topOfWindow + 200) {
                    $(this).attr("src", "img/first/animacion 20.png");
                }
                if (imagePos < topOfWindow + 180) {
                    $(this).attr("src", "img/first/animacion 30.png");
                }
                if (imagePos < topOfWindow + 160) {
                    $(this).attr("src", "img/first/animacion 40.png");
                }
                if (imagePos < topOfWindow + 140) {
                    $(this).attr("src", "img/first/animacion 50.png");
                }
                if (imagePos < topOfWindow + 120) {
                    $(this).attr("src", "img/first/animacion 60.png");
                }
                if (imagePos < topOfWindow + 100) {
                    $(this).attr("src", "img/first/animacion 70.png");
                }
                if (imagePos < topOfWindow + 80) {
                    $(this).attr("src", "img/first/animacion 80.png");
                }
                if (imagePos < topOfWindow + 60) {
                    $(this).attr("src", "img/first/animacion 90.png");
                }
            });
            $('#img-source-2').each(function() {
                var imagePos = $(this).offset().top;
                if (imagePos < topOfWindow + 510) {
                    $(this).attr("src", "img/second/TR 10.png");
                }
                if (imagePos < topOfWindow + 480) {
                    $(this).attr("src", "img/second/TR 20.png");
                }
                if (imagePos < topOfWindow + 450) {
                    $(this).attr("src", "img/second/TR 30.png");
                }
                if (imagePos < topOfWindow + 420) {
                    $(this).attr("src", "img/second/TR 40.png");
                }
                if (imagePos < topOfWindow + 390) {
                    $(this).attr("src", "img/second/TR 50.png");
                }
                if (imagePos < topOfWindow + 360) {
                    $(this).attr("src", "img/second/TR 60.png");
                }
                if (imagePos < topOfWindow + 330) {
                    $(this).attr("src", "img/second/TR 70.png");
                }
                if (imagePos < topOfWindow + 300) {
                    $(this).attr("src", "img/second/TR 80.png");
                }
                if (imagePos < topOfWindow + 270) {
                    $(this).attr("src", "img/second/TR 90.png");
                }
                if (imagePos < topOfWindow + 240) {
                    $(this).attr("src", "img/second/TR 100.png");
                }
                if (imagePos < topOfWindow + 210) {
                    $(this).attr("src", "img/second/TR 110.png");
                }
                if (imagePos < topOfWindow + 180) {
                    $(this).attr("src", "img/second/TR 120.png");
                }
                if (imagePos < topOfWindow + 150) {
                    $(this).attr("src", "img/second/TR 130.png");
                }
                if (imagePos < topOfWindow + 120) {
                    $(this).attr("src", "img/second/TR 140.png");
                }
                if (imagePos < topOfWindow + 90) {
                    $(this).attr("src", "img/second/TR 150.png");
                }
                if (imagePos < topOfWindow + 60) {
                    $(this).attr("src", "img/second/TR 160.png");
                }
                if (imagePos < topOfWindow + 30) {
                    $(this).attr("src", "img/second/TR 170.png");
                }
                if (imagePos < topOfWindow) {
                    $(this).attr("src", "img/second/TR 180.png");
                }
                if (imagePos < topOfWindow - 30) {
                    $(this).attr("src", "img/second/TR 190.png");
                }
            });
            $('#img-source-3').each(function() {
                var imagePos = $(this).offset().top;
                if (imagePos < topOfWindow + 450) {
                    $(this).attr("src", "img/third/Calendar10.png");
                }
                if (imagePos < topOfWindow + 425) {
                    $(this).attr("src", "img/third/Calendar20.png");
                }
                if (imagePos < topOfWindow + 400) {
                    $(this).attr("src", "img/third/Calendar30.png");
                }
                if (imagePos < topOfWindow + 375) {
                    $(this).attr("src", "img/third/Calendar40.png");
                }
                if (imagePos < topOfWindow + 350) {
                    $(this).attr("src", "img/third/Calendar50.png");
                }
                if (imagePos < topOfWindow + 325) {
                    $(this).attr("src", "img/third/Calendar60.png");
                }
                if (imagePos < topOfWindow + 300) {
                    $(this).attr("src", "img/third/Calendar70.png");
                }
                if (imagePos < topOfWindow + 275) {
                    $(this).attr("src", "img/third/Calendar80.png");
                }
                if (imagePos < topOfWindow + 250) {
                    $(this).attr("src", "img/third/Calendar90.png");
                }
                if (imagePos < topOfWindow + 225) {
                    $(this).attr("src", "img/third/Calendar100.png");
                }
                if (imagePos < topOfWindow + 200) {
                    $(this).attr("src", "img/third/Calendar110.png");
                }
                if (imagePos < topOfWindow + 175) {
                    $(this).attr("src", "img/third/Calendar120.png");
                }
                if (imagePos < topOfWindow + 150) {
                    $(this).attr("src", "img/third/Calendar130.png");
                }
                if (imagePos < topOfWindow + 125) {
                    $(this).attr("src", "img/third/Calendar140.png");
                }
                if (imagePos < topOfWindow + 100) {
                    $("#img-source-3").attr("src", "img/third/Calendar150.png");
                }
                if (imagePos < topOfWindow + 75) {
                    $(this).attr("src", "img/third/Calendar160.png");
                }
                if (imagePos < topOfWindow + 50) {
                    $(this).attr("src", "img/third/Calendar170.png");
                }
                if (imagePos < topOfWindow + 25) {
                    $(this).attr("src", "img/third/Calendar180.png");
                }
                if (imagePos < topOfWindow) {
                    $(this).attr("src", "img/third/Calendar190.png");
                }
                if (imagePos < topOfWindow - 25) {
                    $(this).attr("src", "img/third/Calendar200.png");
                }
            });
            $('#img-source-4').each(function() {
                var imagePos = $(this).offset().top;
                if (imagePos < topOfWindow + 440) {
                    $(this).attr("src", "img/fourth/Compu anima10.png");
                }
                if (imagePos < topOfWindow + 420) {
                    $(this).attr("src", "img/fourth/Compu anima20.png");
                }
                if (imagePos < topOfWindow + 400) {
                    $(this).attr("src", "img/fourth/Compu anima30.png");
                }
                if (imagePos < topOfWindow + 380) {
                    $(this).attr("src", "img/fourth/Compu anima40.png");
                }
                if (imagePos < topOfWindow + 360) {
                    $(this).attr("src", "img/fourth/Compu anima50.png");
                }
                if (imagePos < topOfWindow + 340) {
                    $(this).attr("src", "img/fourth/Compu anima60.png");
                }
                if (imagePos < topOfWindow + 320) {
                    $(this).attr("src", "img/fourth/Compu anima70.png");
                }
                if (imagePos < topOfWindow + 300) {
                    $(this).attr("src", "img/fourth/Compu anima80.png");
                }
                if (imagePos < topOfWindow + 280) {
                    $(this).attr("src", "img/fourth/Compu anima90.png");
                }
                if (imagePos < topOfWindow + 260) {
                    $(this).attr("src", "img/fourth/Compu anima100.png");
                }
                if (imagePos < topOfWindow + 240) {
                    $(this).attr("src", "img/fourth/Compu anima110.png");
                }
                if (imagePos < topOfWindow + 220) {
                    $(this).attr("src", "img/fourth/Compu anima120.png");
                }
                if (imagePos < topOfWindow + 200) {
                    $(this).attr("src", "img/fourth/Compu anima130.png");
                }
                if (imagePos < topOfWindow + 180) {
                    $(this).attr("src", "img/fourth/Compu anima140.png");
                }
                if (imagePos < topOfWindow + 160) {
                    $(this).attr("src", "img/fourth/Compu anima150.png");
                }
                if (imagePos < topOfWindow + 140) {
                    $(this).attr("src", "img/fourth/Compu anima160.png");
                }
                if (imagePos < topOfWindow + 120) {
                    $(this).attr("src", "img/fourth/Compu anima170.png");
                }
                if (imagePos < topOfWindow + 100) {
                    $(this).attr("src", "img/fourth/Compu anima180.png");
                }
                if (imagePos < topOfWindow + 80) {
                    $(this).attr("src", "img/fourth/Compu anima190.png");
                }
                if (imagePos < topOfWindow + 60) {
                    $(this).attr("src", "img/fourth/Compu anima200.png");
                }
            });
            $('#img-source-5').each(function() {
                var imagePos = $(this).offset().top;
                if (imagePos < topOfWindow + 375) {
                    $(this).attr("src", "img/fifth/Tablero anima10.png");
                }
                if (imagePos < topOfWindow + 360) {
                    $(this).attr("src", "img/fifth/Tablero anima20.png");
                }
                if (imagePos < topOfWindow + 345) {
                    $(this).attr("src", "img/fifth/Tablero anima30.png");
                }
                if (imagePos < topOfWindow + 340) {
                    $(this).attr("src", "img/fifth/Tablero anima40.png");
                }
                if (imagePos < topOfWindow + 330) {
                    $(this).attr("src", "img/fifth/Tablero anima50.png");
                }
                if (imagePos < topOfWindow + 320) {
                    $(this).attr("src", "img/fifth/Tablero anima60.png");
                }
                if (imagePos < topOfWindow + 310) {
                    $(this).attr("src", "img/fifth/Tablero anima70.png");
                }
                if (imagePos < topOfWindow + 300) {
                    $(this).attr("src", "img/fifth/Tablero anima80.png");
                }
                if (imagePos < topOfWindow + 290) {
                    $(this).attr("src", "img/fifth/Tablero anima90.png");
                }
                if (imagePos < topOfWindow + 275) {
                    $(this).attr("src", "img/fifth/Tablero anima100.png");
                }
                if (imagePos < topOfWindow + 260) {
                    $(this).attr("src", "img/fifth/Tablero anima110.png");
                }
                if (imagePos < topOfWindow + 245) {
                    $(this).attr("src", "img/fifth/Tablero anima120.png");
                }
                if (imagePos < topOfWindow + 230) {
                    $(this).attr("src", "img/fifth/Tablero anima130.png");
                }
                if (imagePos < topOfWindow + 215) {
                    $(this).attr("src", "img/fifth/Tablero anima140.png");
                }
                if (imagePos < topOfWindow + 200) {
                    $(this).attr("src", "img/fifth/Tablero anima150.png");
                }
                if (imagePos < topOfWindow + 190) {
                    $(this).attr("src", "img/fifth/Tablero anima160.png");
                }
                if (imagePos < topOfWindow + 180) {
                    $(this).attr("src", "img/fifth/Tablero anima170.png");
                }
                if (imagePos < topOfWindow + 170) {
                    $(this).attr("src", "img/fifth/Tablero anima180.png");
                }
                if (imagePos < topOfWindow + 160) {
                    $(this).attr("src", "img/fifth/Tablero anima190.png");
                }
                if (imagePos < topOfWindow + 145) {
                    $(this).attr("src", "img/fifth/Tablero anima200.png");
                }
                if (imagePos < topOfWindow + 130) {
                    $(this).attr("src", "img/fifth/Tablero anima210.png");
                }
                if (imagePos < topOfWindow + 120) {
                    $(this).attr("src", "img/fifth/Tablero anima220.png");
                }
                if (imagePos < topOfWindow + 110) {
                    $(this).attr("src", "img/fifth/Tablero anima230.png");
                }
                if (imagePos < topOfWindow + 100) {
                    $(this).attr("src", "img/fifth/Tablero anima240.png");
                }
                if (imagePos < topOfWindow + 90) {
                    $(this).attr("src", "img/fifth/Tablero anima250.png");
                }
                if (imagePos < topOfWindow + 75) {
                    $(this).attr("src", "img/fifth/Tablero anima260.png");
                }
                if (imagePos < topOfWindow + 60) {
                    $(this).attr("src", "img/fifth/Tablero anima270.png");
                }
                if (imagePos < topOfWindow + 45) {
                    $(this).attr("src", "img/fifth/Tablero anima280.png");
                }
            });
            $('#book1').each(function() {
                var rotar = 230 - (barra * 0.10);
                var blur = barra / 1000;
                var ancho = 125 - (barra / 50);
                var marginTop = 1200 - barra / 2.3;
                $(this).css({
                    'transform': 'rotate(' + rotar + 'deg)'
                });
                $(this).css({
                    'margin-top': marginTop + 'px'
                })
                $(this).css({
                    'width': ancho + 'px'
                })
                $(this).css({
                    'filter': 'blur(' + blur + 'px)'
                })
            });
            $('#book2').each(function() {
                var rotar = 35 - (barra * 0.10);
                var marginTop = 1000 - barra / 7;
                $(this).css({
                    'transform': 'rotate(' + rotar + 'deg)'
                });
                $(this).css({
                    'margin-top': marginTop + 'px'
                })
            });
            $('#book3').each(function() {
                var rotar = 230 - (barra * 0.10);
                var marginTop = 875 - barra / 8;
                $(this).css({
                    'transform': 'rotate(' + rotar + 'deg)'
                });
                $(this).css({
                    'margin-top': marginTop + 'px'
                })
            });
            $('#book4').each(function() {
                var rotar = 90 - (barra * 0.10);
                var marginTop = 800 - barra / 3;
                $(this).css({
                    'transform': 'rotate(' + rotar + 'deg)'
                });
                $(this).css({
                    'margin-top': marginTop + 'px'
                })
            });
            $('#dot1s2').each(function() {
                var marginTop = -500 + barra / 5;
                $(this).css({
                    'margin-top': marginTop + 'px'
                })
            });
            $('#plus1s2').each(function() {
                var marginTop = 50 + barra / 3;
                $(this).css({
                    'margin-top': marginTop + 'px'
                })
            });
            $('#plus2s2').each(function() {
                var marginTop = -700 + barra / 3;
                $(this).css({
                    'margin-top': marginTop + 'px'
                })
            });
            $('#plus3s2').each(function() {
                var marginTop = -500 + barra / 5;
                $(this).css({
                    'margin-top': marginTop + 'px'
                })
            });
            $('#hoja1').each(function() {
                var rotar = 230 - (barra * 0.10);
                var marginTop = barra / 8;
                $(this).css({
                    'margin-top': marginTop + 'px'
                });
                if (cont % 2 == 1) {
                    $(this).css({
                        'margin-left': '760px'
                    });
                } else {
                    $(this).css({
                        'margin-left': '800px'
                    });
                }
            });
            $('#copo1').each(function() {
                var rotar = 230 - (barra * 0.10);
                var marginTop = -50 + barra / 25;
                var ancho = 190 - (barra / 40);
                $(this).css({
                    'margin-top': marginTop + 'px'
                })
                $(this).css({
                    'transform': 'rotate(' + rotar + 'deg)'
                });
                $(this).css({
                    'width': ancho + 'px'
                })
            });
            $('#copo2').each(function() {
                var rotar = 90 + (barra * 0.05);
                var marginTop = -150 + barra / 7;
                var ancho = 190 + (barra / 40);
                $(this).css({
                    'margin-top': marginTop + 'px'
                })
                $(this).css({
                    'transform': 'rotate(' + rotar + 'deg)'
                });
                $(this).css({
                    'width': ancho + 'px'
                })
            });
            $('#dot1s3').each(function() {
                var marginTop = -700 + barra / 5;
                $(this).css({
                    'margin-top': marginTop + 'px'
                })
            });
            $('#plus1s3').each(function() {
                var marginTop = -950 + barra / 3;
                $(this).css({
                    'margin-top': marginTop + 'px'
                })
            });
            $('#plus2s3').each(function() {
                var marginTop = -600 + barra / 6;
                $(this).css({
                    'margin-top': marginTop + 'px'
                })
            });
            $('#msg1').each(function() {
                scrolled = barra;
                if (value < scrolled) {
                    signo = 1;
                    value = scrolled;
                } else {
                    if (value > scrolled) {
                        signo = -1;
                        value = scrolled;
                    }
                }
                contMsg1 = contMsg1 + signo;
                var rotar = 45 - (barra * 0.10);
                var blur = barra / 1800;
                var ancho = 175 + contMsg1 / (barra / 2);
                var marginTop = 1950 - barra / 2.3;
                $(this).css({
                    'transform': 'rotate(' + rotar + 'deg)'
                });
                $(this).css({
                    'margin-top': marginTop + 'px'
                })
                $(this).css({
                    'width': ancho + 'px'
                })
                $(this).css({
                    'filter': 'blur(' + blur + 'px)'
                })
            });
            $('#msg2').each(function() {
                var rotar = 180 + (barra * 0.10);
                var blur = barra / 2800;
                var ancho = 150 + barra / 1890;
                var marginTop = 2550 - barra / 2.3;
                $(this).css({
                    'transform': 'rotate(' + rotar + 'deg)'
                });
                if (marginTop > 429) {
                    $(this).css({
                        'margin-top': marginTop + 'px'
                    })
                } else {
                    var marginTopTmp = 400 + barra / 100;
                    $(this).css({
                        'margin-top': marginTopTmp + 'px'
                    })
                }
                $(this).css({
                    'width': ancho + 'px'
                })
                $(this).css({
                    'filter': 'blur(' + blur + 'px)'
                })
            });
            $('#msg3').each(function() {
                var rotar = 270 + (barra * 0.10);
                var ancho = 50 + barra / 100;
                var marginTop = 1850 - barra / 2.3;
                $(this).css({
                    'transform': 'rotate(' + rotar + 'deg)'
                });
                $(this).css({
                    'margin-top': marginTop + 'px'
                })
                $(this).css({
                    'width': ancho + 'px'
                })
            });
            $('#dot1s4').each(function() {
                var marginTop = -350 + barra / 5;
                $(this).css({
                    'margin-top': marginTop + 'px'
                })
            });
            $('#plus1s4').each(function() {
                var marginTop = -1200 + barra / 3;
                $(this).css({
                    'margin-top': marginTop + 'px'
                })
            });
            $('#plus2s4').each(function() {
                var marginTop = -700 + barra / 6;
                $(this).css({
                    'margin-top': marginTop + 'px'
                })
            });
            $('#dcl1').each(function() {
                scrolled = barra;
                if (value < scrolled) {
                    signo = 1;
                    value = scrolled;
                } else {
                    if (value > scrolled) {
                        signo = -1;
                        value = scrolled;
                    }
                }
                contMsg1 = contMsg1 + signo;
                var rotar = 45 - (barra * 0.10);
                var blur = barra / 2800;
                var ancho = 135 + contMsg1 / (barra / 2);
                var marginTop = 2150 - barra / 3.2;
                $(this).css({
                    'transform': 'rotate(' + rotar + 'deg)'
                });
                $(this).css({
                    'margin-top': marginTop + 'px'
                })
                $(this).css({
                    'width': ancho + 'px'
                })
                $(this).css({
                    'filter': 'blur(' + blur + 'px)'
                })
            });
            $('#dcl2').each(function() {
                var rotar = 180 + (barra * 0.10);
                var blur = barra / 2800;
                var ancho = 80 + barra / 1890;
                var marginTop = 1000 - barra / 5;
                $(this).css({
                    'transform': 'rotate(' + rotar + 'deg)'
                });
                $(this).css({
                    'margin-top': marginTop + 'px'
                })
                $(this).css({
                    'width': ancho + 'px'
                })
                $(this).css({
                    'filter': 'blur(' + blur + 'px)'
                })
            });
            $('#dcl3').each(function() {
                var rotar = 270 + (barra * 0.10);
                var ancho = 150 + barra / 100;
                var marginTop = 450 - barra / 100;
                $(this).css({
                    'transform': 'rotate(' + rotar + 'deg)'
                });
                $(this).css({
                    'margin-top': marginTop + 'px'
                })
                $(this).css({
                    'width': ancho + 'px'
                })
            });
            $('#dot1s5').each(function() {
                var marginTop = -950 + barra / 5;
                $(this).css({
                    'margin-top': marginTop + 'px'
                })
            });
            $('#plus1s5').each(function() {
                var marginTop = -1700 + barra / 3;
                $(this).css({
                    'margin-top': marginTop + 'px'
                })
            });
            $('#plus2s5').each(function() {
                var marginTop = -700 + barra / 6;
                $(this).css({
                    'margin-top': marginTop + 'px'
                })
            });
            $('#texto-0').each(function() {
                var imagePos = $(this).offset().top;
                if (imagePos < topOfWindow + 450) {
                    $(this).addClass("slideRight");
                }
            });
            $('#texto').each(function() {
                var imagePos = $(this).offset().top;
                if (imagePos < topOfWindow + 450) {
                    $(this).addClass("slideLeft");
                }
            });
            $('#texto-1').each(function() {
                var imagePos = $(this).offset().top;
                if (imagePos < topOfWindow + 450) {
                    $(this).addClass("slideRight");
                }
            });
            $('#texto-2').each(function() {
                var imagePos = $(this).offset().top;
                if (imagePos < topOfWindow + 450) {
                    $(this).addClass("slideLeft");
                }
            });
            $('#texto-3').each(function() {
                var imagePos = $(this).offset().top;
                if (imagePos < topOfWindow + 450) {
                    $(this).addClass("slideRight");
                }
            });
            $('#texto-4').each(function() {
                var imagePos = $(this).offset().top;
                if (imagePos < topOfWindow + 450) {
                    $(this).addClass("slideLeft");
                }
            });
            $('#texto-5').each(function() {
                var imagePos = $(this).offset().top;
                if (imagePos < topOfWindow + 450) {
                    $(this).addClass("slideRight");
                }
            });
            $('.hide').each(function() {
                if (barra > 15) {
                    $(this).css({
                        'opacity': '0'
                    });
                    $('#link1').removeClass('blue');
                    $('#link1').addClass('strong-blue');
                    $('#link2').removeClass('blue');
                    $('#link2').addClass('strong-blue');
                    $('#link3').removeClass('white');
                    $('#link3').addClass('strong-blue');
                    $('#link4').removeClass('white');
                    $('#link4').addClass('strong-blue');
                    $('#covid').removeClass('white-button');
                    $('#covid').addClass('strong-blue-button');
                } else {
                    $(this).css({
                        'opacity': '1'
                    });
                    $('#link1').removeClass('strong-blue');
                    $('#link1').addClass('blue');
                    $('#link2').removeClass('strong-blue');
                    $('#link2').addClass('blue');
                    $('#link3').removeClass('strong-blue');
                    $('#link3').addClass('white');
                    $('#link4').removeClass('strong-blue');
                    $('#link4').addClass('white');
                    $('#covid').removeClass('strong-blue-button');
                    $('#covid').addClass('white-button');
                }
            });
            $('#cam1').each(function() {
                var rotar = 210 + (barra * 0.10);
                var ancho = 150 + barra / 100;
                var marginTop = 550 - barra / 100;
                $(this).css({
                    'transform': 'rotate(' + rotar + 'deg)'
                });
                $(this).css({
                    'margin-top': marginTop + 'px'
                })
                $(this).css({
                    'width': ancho + 'px'
                })
            });
            $('#cam2').each(function() {
                var rotar = -145 + (barra * 0.10);
                var ancho = 75 + barra / 100;
                var marginTop = 150 - barra / 5;
                $(this).css({
                    'transform': 'rotate(' + rotar + 'deg)'
                });
                $(this).css({
                    'margin-top': marginTop + 'px'
                })
                $(this).css({
                    'width': ancho + 'px'
                })
            });
            $('#cam3').each(function() {
                var rotar = 220 + (barra * 0.10);
                var ancho = 100 + barra / 100;
                var marginTop = 500 - barra / 100;
                $(this).css({
                    'transform': 'scaleX(-1) rotate(' + rotar + 'deg)'
                });
                $(this).css({
                    'margin-top': marginTop + 'px'
                })
                $(this).css({
                    'width': ancho + 'px'
                })
            });
            $('#dot1s0').each(function() {
                var marginTop = -150 + barra / 2.3;
                $(this).css({
                    'margin-top': marginTop + 'px'
                })
            });
            $('#dot2s0').each(function() {
                var marginTop = -200 + barra / 5;
                $(this).css({
                    'margin-top': marginTop + 'px'
                })
            });
            $('#plus1s0').each(function() {
                var marginTop = -200 + barra / 2.3;
                $(this).css({
                    'margin-top': marginTop + 'px'
                })
            });
        });
        $('.hide').hover(function() {
            $(this).css({
                'opacity': '1'
            })
        })
        $('.hide').mouseleave(function() {
            var barra = $(window).scrollTop();
            if (barra > 150) {
                $(this).css({
                    'opacity': '0'
                });
                $('#link1').removeClass('blue');
                $('#link1').addClass('strong-blue');
                $('#link2').removeClass('blue');
                $('#link2').addClass('strong-blue');
                $('#link3').removeClass('white');
                $('#link3').addClass('strong-blue');
                $('#link4').removeClass('white');
                $('#link4').addClass('strong-blue');
                $('#covid').removeClass('white-button');
                $('#covid').addClass('strong-blue-button');
            } else {
                $(this).css({
                    'opacity': '1'
                });
                $('#link1').removeClass('strong-blue');
                $('#link1').addClass('blue');
                $('#link2').removeClass('strong-blue');
                $('#link2').addClass('blue');
                $('#link3').removeClass('strong-blue');
                $('#link3').addClass('white');
                $('#link4').removeClass('strong-blue');
                $('#link4').addClass('white');
                $('#covid').removeClass('strong-blue-button');
                $('#covid').addClass('white-button');
            }
        });
        

        // $('.txt').html(function(i, html) {
        //     var chars = $.trim(html).split("");

        //     return '<span>' + chars.join('</span><span>') + '</span>';
        // });
    </script>

</body>

</html>