
     .entra-izq{
         animation: desde-izq .5s  cubic-bezier(0.125, 0.805, 0.270, 0.910) 1;
     }

     .sale-izq{
         animation: hacia-izq .5s  cubic-bezier(0.125, 0.805, 0.270, 0.910) 1;
     }


     @-webkit-keyframes desde-izq{
         from{
             -webkit-transform: translateX(-100%);
             -moz-transform: translateX(-100%);
             -ms-transform: translateX(-100%);
             -o-transform: translateX(-100%);
             transform: translateX(-100%);

         }
         to{
             -webkit-transform: translateX(0);
             -moz-transform: translateX(0);
             -ms-transform: translateX(0);
             -o-transform: translateX(0);
             transform: translateX(0);

         }
     }
     @-moz-keyframes desde-izq{
         from{
             -webkit-transform: translateX(-100%);
             -moz-transform: translateX(-100%);
             -ms-transform: translateX(-100%);
             -o-transform: translateX(-100%);
             transform: translateX(-100%);

         }
         to{
             -webkit-transform: translateX(0);
             -moz-transform: translateX(0);
             -ms-transform: translateX(0);
             -o-transform: translateX(0);
             transform: translateX(0);

         }
     }
     @-o-keyframes desde-izq{
         from{
             -webkit-transform: translateX(-100%);
             -moz-transform: translateX(-100%);
             -ms-transform: translateX(-100%);
             -o-transform: translateX(-100%);
             transform: translateX(-100%);

         }
         to{
             -webkit-transform: translateX(0);
             -moz-transform: translateX(0);
             -ms-transform: translateX(0);
             -o-transform: translateX(0);
             transform: translateX(0);

         }
     }
     @keyframes desde-izq{
         from{
             -webkit-transform: translateX(-100%);
             -moz-transform: translateX(-100%);
             -ms-transform: translateX(-100%);
             -o-transform: translateX(-100%);
             transform: translateX(-100%);

         }
         to{
             -webkit-transform: translateX(0);
             -moz-transform: translateX(0);
             -ms-transform: translateX(0);
             -o-transform: translateX(0);
             transform: translateX(0);

         }
     }

     @-webkit-keyframes hacia-izq{
         from{
             -webkit-transform: translateX(0);
             -moz-transform: translateX(0);
             -ms-transform: translateX(0);
             -o-transform: translateX(0);
             transform: translateX(0);
         }
         to{

             -webkit-transform: translateX(-100%);
             -moz-transform: translateX(-100%);
             -ms-transform: translateX(-100%);
             -o-transform: translateX(-100%);
             transform: translateX(-100%);

         }
     }
     @-moz-keyframes hacia-izq{
         from{
             -webkit-transform: translateX(0);
             -moz-transform: translateX(0);
             -ms-transform: translateX(0);
             -o-transform: translateX(0);
             transform: translateX(0);
         }
         to{

             -webkit-transform: translateX(-100%);
             -moz-transform: translateX(-100%);
             -ms-transform: translateX(-100%);
             -o-transform: translateX(-100%);
             transform: translateX(-100%);

         }
     }
     @-o-keyframes hacia-izq{
         from{
             -webkit-transform: translateX(0);
             -moz-transform: translateX(0);
             -ms-transform: translateX(0);
             -o-transform: translateX(0);
             transform: translateX(0);
         }
         to{

             -webkit-transform: translateX(-100%);
             -moz-transform: translateX(-100%);
             -ms-transform: translateX(-100%);
             -o-transform: translateX(-100%);
             transform: translateX(-100%);

         }
     }
     @keyframes hacia-izq{
         from{
             -webkit-transform: translateX(0);
             -moz-transform: translateX(0);
             -ms-transform: translateX(0);
             -o-transform: translateX(0);
             transform: translateX(0);
         }
         to{

             -webkit-transform: translateX(-100%);
             -moz-transform: translateX(-100%);
             -ms-transform: translateX(-100%);
             -o-transform: translateX(-100%);
             transform: translateX(-100%);

         }
     }

     /*animacion para el espan del campo buscar*/
     @-webkit-keyframes parpadea {
         0%{
             opacity: 1;
         }
         29%{opacity: 1}
         100%{
             opacity: 0;

         }
     }
     @-moz-keyframes parpadea {
         0%{
             opacity: 1;
         }
         29%{opacity: 1}
         100%{
             opacity: 0;

         }
     }
     @-ms-keyframes parpadea {
         0%{
             opacity: 1;
         }
         29%{opacity: 1}
         100%{
             opacity: 0;

         }
     }
     @-o-keyframes parpadea {
         0%{
             opacity: 1;
         }
         29%{opacity: 1}
         100%{
             opacity: 0;

         }
     }
     @keyframes parpadea {
         0%{
             opacity: 1;
         }
         29%{opacity: 1}
         100%{
             opacity: 0;

         }
     }




     /*entrada en scala Grande*/
     @keyframes grande-p {
         from{
             -webkit-transform: scale(1.1);
             -moz-transform: scale(1.1);
             -ms-transform: scale(1.1);
             -o-transform: scale(1.1);
             transform: scale(1.1);
             opacity:0;
         }
         to{
             -webkit-transform: scale(1);
             -moz-transform: scale(1);
             -ms-transform: scale(1);
             -o-transform: scale(1);
             transform: scale(1);
             opacity: 1;
         }
     }

     /*entrada en scala natural*/
     @keyframes pequeño-g {
         from{
             -webkit-transform: scale(1);
             -moz-transform: scale(1);
             -ms-transform: scale(1);
             -o-transform: scale(1);
             transform: scale(1);
             opacity: 1;
         }
         to{
             -webkit-transform:scale(1.1);
             -moz-transform: scale(1.1);
             -ms-transform: scale(1.1);
             -o-transform: scale(1.1);
             transform: scale(1.1);
             opacity:0;
         }
     }

     .entra-sg{
         animation:grande-p .5s cubic-bezier(0.125, 0.805, 0.270, 0.910) 1;
     }
     .sale-sg{
         animation:pequeño-g .5s cubic-bezier(0.125, 0.805, 0.270, 0.910) 1;
     }

     /*entra escala pequeña*/

     .entra-aa{
         animation:entra-aa .5s cubic-bezier(0.125, 0.805, 0.270, 0.910) 1;
     }
     @keyframes entra-aa {
         0%{
             -webkit-transform:translateY(100%);
             -moz-transform:translateY(100%);
             -ms-transform:translateY(100%);
             -o-transform:translateY(100%);
             transform:translateY(100%);
            opacity: 0;
         }
         100%{
             -webkit-transform: translateY(0);
             -moz-transform: translateY(0);
             -ms-transform: translateY(0);
             -o-transform: translateY(0);
             transform: translateY(0);
             opacity:1;
         }

     }

     @keyframes anclad{
         0%{
             -webkit-transform: scale(0) rotate(0);
             -moz-transform: scale(0) rotate(0);
             -ms-transform: scale(0) rotate(0);
             -o-transform: scale(0) rotate(0);
             transform: scale(0) rotate(0);
             opacity: 0;
         }
         70%{
             -webkit-transform: scale(1.2) rotate(65deg);
             -moz-transform: scale(1.2) rotate(65deg);
             -ms-transform: scale(1.2) rotate(65deg);
             -o-transform: scale(1.2) rotate(65deg);
             transform: scale(1.2) rotate(65deg);
             opacity:1;
         }
         100%{
             -webkit-transform: scale(1) rotate(0deg);
             -moz-transform: scale(1) rotate(0deg);
             -ms-transform: scale(1) rotate(0deg);
             -o-transform: scale(1) rotate(0deg);
             transform: scale(1) rotate(0deg);
             opacity:1;
         }
     }


     .entra-de-pe{
         animation: desde-peq .5s cubic-bezier(0.000, 0.730, 0.000, 1.000) 1;
     }

     .hacia-pe{
         animation: hacia-peq .5s cubic-bezier(0.000, 0.730, 0.000, 1.000) 1;
     }

     @-webkit-keyframes desde-peq{
         from{
             -webkit-transform: scale(.9);
             -moz-transform: scale(.9);
             -ms-transform: scale(.9);
             -o-transform: scale(.9);
             transform: scale(.9);
             opacity:0;
         }
         to{
             -webkit-transform: scale(1);
             -moz-transform: scale(1);
             -ms-transform: scale(1);
             -o-transform: scale(1);
             transform: scale(1);
             opacity:1;
         }
     }
     @-moz-keyframes desde-peq{
         from{
             -webkit-transform: scale(.9);
             -moz-transform: scale(.9);
             -ms-transform: scale(.9);
             -o-transform: scale(.9);
             transform: scale(.9);
             opacity:0;
         }
         to{
             -webkit-transform: scale(1);
             -moz-transform: scale(1);
             -ms-transform: scale(1);
             -o-transform: scale(1);
             transform: scale(1);
             opacity:1;
         }
     }
     @-ms-keyframes desde-peq{
         from{
             -webkit-transform: scale(.9);
             -moz-transform: scale(.9);
             -ms-transform: scale(.9);
             -o-transform: scale(.9);
             transform: scale(.9);
             opacity:0;
         }
         to{
             -webkit-transform: scale(1);
             -moz-transform: scale(1);
             -ms-transform: scale(1);
             -o-transform: scale(1);
             transform: scale(1);
             opacity:1;
         }
     }
     @-o-keyframes desde-peq{
         from{
             -webkit-transform: scale(.9);
             -moz-transform: scale(.9);
             -ms-transform: scale(.9);
             -o-transform: scale(.9);
             transform: scale(.9);
             opacity:0;
         }
         to{
             -webkit-transform: scale(1);
             -moz-transform: scale(1);
             -ms-transform: scale(1);
             -o-transform: scale(1);
             transform: scale(1);
             opacity:1;
         }
     }
     @keyframes desde-peq{
         from{
             -webkit-transform: scale(.9);
             -moz-transform: scale(.9);
             -ms-transform: scale(.9);
             -o-transform: scale(.9);
             transform: scale(.9);
             opacity:0;
         }
         to{
             -webkit-transform: scale(1);
             -moz-transform: scale(1);
             -ms-transform: scale(1);
             -o-transform: scale(1);
             transform: scale(1);
             opacity:1;
         }
     }

     @-webkit-keyframes hacia-peq{
         from{

             -webkit-transform: scale(1);
             -moz-transform: scale(1);
             -ms-transform: scale(1);
             -o-transform: scale(1);
             transform: scale(1);
             opacity:1;
         }
         to{
             -webkit-transform: scale(.9);
             -moz-transform: scale(.9);
             -ms-transform: scale(.9);
             -o-transform: scale(.9);
             transform: scale(.9);
             opacity:0;

         }
     }
     @-moz-keyframes hacia-peq{
         from{

             -webkit-transform: scale(1);
             -moz-transform: scale(1);
             -ms-transform: scale(1);
             -o-transform: scale(1);
             transform: scale(1);
             opacity:1;
         }
         to{
             -webkit-transform: scale(.9);
             -moz-transform: scale(.9);
             -ms-transform: scale(.9);
             -o-transform: scale(.9);
             transform: scale(.9);
             opacity:0;

         }
     }
     @-ms-keyframes hacia-peq{
         from{

             -webkit-transform: scale(1);
             -moz-transform: scale(1);
             -ms-transform: scale(1);
             -o-transform: scale(1);
             transform: scale(1);
             opacity:1;
         }
         to{
             -webkit-transform: scale(.9);
             -moz-transform: scale(.9);
             -ms-transform: scale(.9);
             -o-transform: scale(.9);
             transform: scale(.9);
             opacity:0;

         }
     }
     @-o-keyframes hacia-peq{
         from{

             -webkit-transform: scale(1);
             -moz-transform: scale(1);
             -ms-transform: scale(1);
             -o-transform: scale(1);
             transform: scale(1);
             opacity:1;
         }
         to{
             -webkit-transform: scale(.9);
             -moz-transform: scale(.9);
             -ms-transform: scale(.9);
             -o-transform: scale(.9);
             transform: scale(.9);
             opacity:0;

         }
     }
     @keyframes hacia-peq{
         from{

             -webkit-transform: scale(1);
             -moz-transform: scale(1);
             -ms-transform: scale(1);
             -o-transform: scale(1);
             transform: scale(1);
             opacity:1;
         }
         to{
             -webkit-transform: scale(.9);
             -moz-transform: scale(.9);
             -ms-transform: scale(.9);
             -o-transform: scale(.9);
             transform: scale(.9);
             opacity:0;

         }
     }


     @keyframes anima-f {
         from{
             background-position: 0 center;
         }
         to{
             background-position: 100% center;
         }
     }


     .entra-der{
         animation: desde-der 1s linear 1;
     }

     @-webkit-keyframes desde-der {
        from{
            -webkit-transform: translateX(100%);
            -moz-transform: translateX(100%);
            -ms-transform: translateX(100%);
            -o-transform: translateX(100%);
            transform: translateX(100%);
            opacity: 0;
        }        
         to{
             -webkit-transform: translate(0);
             -moz-transform: translate(0);
             -ms-transform: translate(0);
             -o-transform: translate(0);
             transform: translate(0);
             opacity:1;
         }
     }
     @-moz-keyframes desde-der {
         from{
             -webkit-transform: translateX(100%);
             -moz-transform: translateX(100%);
             -ms-transform: translateX(100%);
             -o-transform: translateX(100%);
             transform: translateX(100%);
             opacity: 0;
         }
         to{
             -webkit-transform: translate(0);
             -moz-transform: translate(0);
             -ms-transform: translate(0);
             -o-transform: translate(0);
             transform: translate(0);
             opacity:1;
         }
     }
     @-ms-keyframes desde-der {
         from{
             -webkit-transform: translateX(100%);
             -moz-transform: translateX(100%);
             -ms-transform: translateX(100%);
             -o-transform: translateX(100%);
             transform: translateX(100%);
             opacity: 0;
         }
         to{
             -webkit-transform: translate(0);
             -moz-transform: translate(0);
             -ms-transform: translate(0);
             -o-transform: translate(0);
             transform: translate(0);
             opacity:1;
         }
     }
     @-o-keyframes desde-der {
         from{
             -webkit-transform: translateX(100%);
             -moz-transform: translateX(100%);
             -ms-transform: translateX(100%);
             -o-transform: translateX(100%);
             transform: translateX(100%);
             opacity: 0;
         }
         to{
             -webkit-transform: translate(0);
             -moz-transform: translate(0);
             -ms-transform: translate(0);
             -o-transform: translate(0);
             transform: translate(0);
             opacity:1;
         }
     }
     @keyframes desde-der {
         from{
             -webkit-transform: translateX(100%);
             -moz-transform: translateX(100%);
             -ms-transform: translateX(100%);
             -o-transform: translateX(100%);
             transform: translateX(100%);
             opacity: 0;
         }
         to{
             -webkit-transform: translate(0);
             -moz-transform: translate(0);
             -ms-transform: translate(0);
             -o-transform: translate(0);
             transform: translate(0);
             opacity:1;
         }
     }

