.imgPopAnim {animation: imgPopAnim .5s forwards; transform: translateY(300px); opacity: 0; animation-delay: 2s}
@keyframes imgPopAnim{
    0%{transform: translateY(300px); opacity: 0}
    100%{transform: translateY(0px); opacity: 1}
}

.imgPopAnim-off {animation: imgPopAnim-off .5s forwards; transform: translateY(0px); opacity: 1;}
@keyframes imgPopAnim-off{
    0%{transform: translateY(0px); opacity: 1}
    100%{transform: translateY(-300px); opacity: 0}
}


.popgeneral {animation: popgeneral .3s forwards; opacity: 0; animation-delay: 1.7s} 
@keyframes popgeneral{
    0%{opacity: 0}
    100%{opacity: 1}
}

.salepop {animation: salepopgeneral .3s forwards; opacity: 1; visibility: visible; animation-delay: .3s}
@keyframes salepopgeneral{
    0%{opacity: 1; visibility: visible;}
    100%{opacity: 0; visibility: hidden;}
}







.wrap-input-campo1 .campo-search {animation: inputsearch 1.4s infinite;}
@keyframes inputsearch {
    0% {background: var(--color-secundario-light); border: 2px solid var(--color-secundario);}
    50% {background: white; border: 2px solid var(--color-gray1);}
    100% {background: var(--color-secundario-light); border: 2px solid var(--color-secundario);}
}

.wrap-input-campo1 .ico-ddywe242gs {animation: icosearch 1.4s infinite;}
@keyframes icosearch {
    0% {color: var(--color-secundario);}
    50% {color: black;}
    100% {color: var(--color-secundario);}
}



.Baner-btdown   {animation: flechadown1 1s infinite;}
@keyframes flechadown1 {
    0% {padding: 10px 0px 0px 0px;}
    50% {padding: 0px 0px 10px 0px;}
    100% {padding: 10px 0px 0px 0px;}
}



.Wrap-didd00d9d {animation: flechadown2 1s infinite;}
@keyframes flechadown2 {
    0% {transform: scale(.8);}
    50% {transform: scale(1.03);}
    100% {transform: scale(.8);}
}


.Bgfondo-left img {animation: banerimg 40s infinite;}
@keyframes banerimg {
    0% {width: 120%; height: 120%;}
    50% {width: 100%; height: 100%;}
    100% {width: 120%; height: 120%;}
}


.vib {animation: tipe .5s infinite;}
@keyframes tipe {
    0% {opacity: 1;}
    50% {opacity: 0;}
    100% {opacity: 1;}
}


.wrap-tipeo {animation: tipo 4s infinite;}
@keyframes tipo {
    0% {width: 12px;}
    20% {width: 12px;}
    40% {width: 157px;}
    90% {width: 157px;}
    100% {width: 12px;}
}



.wrap-tipeo1 {animation: tipo 4s infinite;}
@keyframes tipo1 {
    0% {width: 12px;}
    20% {width: 12px;}
    40% {width: 155px;}
    90% {width: 155px;}
    100% {width: 12px;}
}

.wrap-tipeo2 {animation: tipo 4s infinite;}
@keyframes tipo2 {
    0% {width: 12px;}
    20% {width: 12px;}
    40% {width: 157px;}
    90% {width: 157px;}
    100% {width: 12px;}
}

.wrap-tipeo3 {animation: tipo 4s infinite;}
@keyframes tipo3 {
    0% {width: 12px;}
    20% {width: 12px;}
    40% {width: 215px;}
    90% {width: 215px;}
    100% {width: 12px;}
}

.wrap-tipeo4 {animation: tipo 4s infinite;}
@keyframes tipo4 {
    0% {width: 12px;}
    20% {width: 12px;}
    40% {width: 153px;}
    90% {width: 153px;}
    100% {width: 12px;}
}

.wrap-tipeo5 {animation: tipo 4s infinite;}
@keyframes tipo5 {
    0% {width: 12px;}
    20% {width: 12px;}
    40% {width: 135px;}
    90% {width: 135px;}
    100% {width: 12px;}
}

.wrap-tipeo6 {animation: tipo 4s infinite;}
@keyframes tipo6 {
    0% {width: 12px;}
    20% {width: 12px;}
    40% {width: 182px;}
    90% {width: 182px;}
    100% {width: 12px;}
}


.Header {animation: header .5s forwards; animation-delay: .8s;}
@keyframes header {
    0% {transform: translateY(-200px);}
    100% {transform: translateY(0px);}
}


.Bgfondo-left, .Bgmob {animation: bnleft .7s forwards; animation-delay: .2s;}
@keyframes bnleft {
    0% {width: 0%;}
    100% {width: 50%;}
}
.Bgmob {animation: didk .7s forwards; animation-delay: .2s; width: 0%;}
@keyframes didk {
    0% {width: 0%;}
    100% {width: 100%;}
}


.Content-landing, .Content, .Baner {animation: wrap .5s forwards; animation-delay: .8s; transform: translateY(200px); opacity: 0;}
@keyframes wrap {
    0% {transform: translateY(200px); opacity: 0;}
    100% {transform: translateY(0px); opacity: 1;}
}



.Content-baner, .Content-wrapbtnpr, .Wrap-formpros {animation: wrapform .5s forwards; animation-delay: 1.2s;}
@keyframes wrapform {
    0% {opacity: 0;}
    100% {opacity: 1;}
}




.Modalprog {animation: shadowprog .3s forwards; opacity: 0; transform: translateY(50px);}
@keyframes shadowprog {
    0% {opacity: 0; transform: translateY(50px);}
    100% {opacity: 1; transform: translateY(0px);}
}

.Modalprog-wrap {animation: shadowprog2 .3s forwards; opacity: 0; transform: translateY(-50px); animation-delay: .4s;}
@keyframes shadowprog2 {
    0% {opacity: 0; transform: translateY(-50px);}
    100% {opacity: 1; transform: translateY(0px);}
}








/* LOADING SOMBRA */
.Pause {animation: wrapform .6s forwards;}
@keyframes wrapform {
    0% {opacity: 0;}
    90% {opacity: 1;}
    100% {opacity: 1;}
}
/* LOADING SOMBRA */




/* MENU NAVEGADOR */
.Navegador-f0ff6df5 {animation: wrapform .5s forwards; animation-delay: 1.5s; opacity: 0;}
@keyframes wrapform {
    0% {opacity: 0;}
    100% {opacity: 1;}
}



.Navegador {animation: bgmenu .5s forwards; opacity: 0;}
@keyframes bgmenu {
    0% {opacity: 0;}
    100% {opacity: 1;}
}

.Navegador-close, .Navegador-wrapheader {animation: menuitem1 .5s forwards; animation-delay: .5s; opacity: 0; transform: translateY(-50px);}
@keyframes menuitem1 {
    0% {opacity: 0; transform: translateY(-50px);}
    100% {opacity: 1; transform: translateY(0px);}
}

.Navegador-separation1, .Navegador-wrapprog {animation: menuitem1 .5s forwards; animation-delay: .8s; opacity: 0; transform: translateY(-50px);}
@keyframes menuitem1 {
    0% {opacity: 0; transform: translateY(-50px);}
    100% {opacity: 1; transform: translateY(0px);}
}

.Navegador-separation2, .Navegador-separation3, .Navegador-btlinks, .Navegador-otherslink {animation: menuitem1 .5s forwards; animation-delay: 1.1s; opacity: 0; transform: translateY(-50px);}
@keyframes menuitem1 {
    0% {opacity: 0; transform: translateY(-50px);}
    100% {opacity: 1; transform: translateY(0px);}
}



/* MOSTRAR Y OCULTAR */
.mostrar_M {
    display: flex;
}
.sale1 {animation: linkjs1 .5s forwards; opacity: 1; transform: translateY(0px);}
@keyframes linkjs1 {
    0% {opacity: 1; transform: translateY(0px);}
    100% {opacity: 0; transform: translateY(-50px);}
}
.sale2 {animation: linkjs1 .5s forwards; animation-delay: .4s; opacity: 1; transform: translateY(0px);}
@keyframes linkjs1 {
    0% {opacity: 1; transform: translateY(0px);}
    100% {opacity: 0; transform: translateY(-50px);}
}
.sale3 {animation: linkjs1 .5s forwards; animation-delay: .8s; opacity: 1; transform: translateY(0px);}
@keyframes linkjs1 {
    0% {opacity: 1; transform: translateY(0px);}
    100% {opacity: 0; transform: translateY(-50px);}
}
.salemenu {animation: salemenu1 .5s forwards; animation-delay: 1.1s; opacity: 1; transform: translateY(0px);}
@keyframes salemenu1 {
    0% {opacity: 1; transform: translateY(0px); visibility: visible;}
    70% {opacity: 0; transform: translateY(-50px); visibility: visible;}
    90% {opacity: 0; transform: translateY(-50px); visibility: hidden;}
    100% {opacity: 0; transform: translateY(-50px); visibility: hidden; display: none !important; z-index: -1;}
}

/* MOSTRAR Y OCULTAR */



/* MENU NAVEGADOR */













@media screen and (max-width: 960px) {

.Header {animation: header .5s forwards; animation-delay: .3s;}
@keyframes header {
    0% {transform: translateY(-200px);}
    100% {transform: translateY(0px);}
}

.Content-landing, .Content, .Baner, .Beneficios {animation: wrap .5s forwards; animation-delay: .5s; transform: translateY(200px); opacity: 0;}
@keyframes wrap {
    0% {transform: translateY(200px); opacity: 0;}
    100% {transform: translateY(0px); opacity: 1;}
}


.Content-baner, .Content-wrapbtnpr, .Wrap-formpros {animation: wrapform .5s forwards; animation-delay: .8s;}
@keyframes wrapform {
    0% {opacity: 0;}
    100% {opacity: 1;}
}




}



























@media screen and (max-width: 650px) {








}