/* CSS de landing */

*{box-sizing: border-box; margin: 0; padding: 0}


body{
   
      background-image: url(../img/fondo-tp.jpg); 
      background-repeat: no-repeat;
      width: 100%;
    background-size: 100%;

    
     
}

a {
    text-decoration: none;
    color: #5d5f5f
}


/* Tp fadu Graph*/

.tp{
   
   
    width: 100%;
    
     

}
/*logo*/
.tp header img{
    
    margin: 0,5rem 5rem 1rem 1rem;
    padding: 0.5rem 0.5rem 0.5rem 0.5rem;
    
    
}
 /* menú de tp */


.tp header{
    
    display: flex;
    background-color: #593AFF;
    box-shadow:0px 0px 10px #222 inset;
    width: 100%
    
   
    
}


.tp nav {
    align-content: flex-end;
    padding-right: 0rem;
    padding-top: 0.2rem;
    margin-left: 65%
    
    
        
    
}
.tp nav ul{
    display: flex;
    margin-top: 1rem;
    
}
.tp nav ul li{
    list-style-type: none;
}
.tp nav ul li a { 
    padding: 0.5rem;
    margin: 1rem 1rem 1rem 0rem;
    background-color: #593AFF;
    color: #fff;
    font-family: 'Lato', sans-serif;
    font-size: 13px;
    background-color: transparent; /* puse transparente porque usa el mismo css, y en el resto tiene fondo blanco*/
}


.info1 {
    display: flex;
    margin-top: 5rem; 
    width: 100%;
    flex-wrap: wrap;
    
   
}

.celu {
    padding-left: 9%;
     width: 50%;
    padding-bottom: 25rem;
    
    
         

    
    
}
.appstore{
    width: 50%;
    padding-top: 3rem;

}
.appstore h1{
    font-family: 'Rubik', sans-serif;
    color: #ffffff;
    text-transform: uppercase;
    font-size: 3rem;
}
.appstore p{
    font-family: 'Rubik', sans-serif; 
    color: #ffffff;
    font-size: 1rem;
    padding-top: 3rem;
}
    .appstore img{
        width: 60%;
     padding-top: 7%;   
    }        

.info2{
    background-color: white;
    padding-top: 0rem;
  
}

.info2 h3{
    font-family: 'Rubik', sans-serif;
    color: #222;
    text-transform: uppercase;
    font-size: 1rem;
    text-align: center;
      
}
.info2 p{
     font-family: 'Rubik', sans-serif; 
    color: #222;
    font-size: 1rem;
     text-align: center;
    padding-top: 1rem;
 
   
}
.info3{
  padding-top: 8rem;  
background-color: white;
}
.info3 img{
    
width: 100%;
height: 100%;
}

.info4{
    padding-top: 8rem;  
    background-color: white;
    display: flex;
    text-align: center;
    align-content: center;
    justify-content: center;
}
    .info4 h3{
    font-family: 'Rubik', sans-serif;
    color: #222;
    text-transform: uppercase;
    font-size: 1rem;
    text-align: center; 
        
}   
.info4 p{
    font-family: 'Rubik', sans-serif; 
    color: #222;
    font-size: 1rem;
    text-align: center;
    padding-top: 1rem;  
}
    

.info4 img{
    width: 50%;
    height: 50%;
}

.info5{
  font-family: 'Rubik', sans-serif;    
  text-transform: uppercase;
    text-align: center;
    margin-top: 8rem;
    

}
.info5 img{
padding-bottom: 5rem;
    width: 50%;
    
}
.info5 a{
border-radius: 20rem;
font-weight: 600;
font-size: 20px;
color:#333333;
padding-top:15px;
padding-bottom:15px;
padding-left:40px;
padding-right:40px;
background-color:rgb(66, 250, 73);
border-radius:35px;
margin-top: 50px !important;
margin-left: 3%;

    
}

/* video */
.video{
    display: flex;
    justify-content: center;
    margin-top: 5%;
     margin-bottom: 5%;
     margin-left: 15%;
       margin-right: 15%;  
    width: 74%;
    height: 32rem;
}

/* descarga */
.descarga{
    margin-top: 2%;
}

/*Pie de Página*/

footer p {
    font-size: 16px;
    line-height: 26px;
    text-indent: 30px;
    text-align: center;
   
    background-color: #593AFF;
    margin-top: 1rem;
    padding: 2%;
    color: #ffffff;
}

.bot_menu{
display: none;
    
}

footer{
    background-color: #593AFF;
    padding: 5%;
    margin-top: 7%;
}


/* desktop*/ 
@media screen and (max-width:600px) {
   
       /* estilo menu hamburguesa*/
.fa-bars{
    color: white;
    padding-top: 10px;
    margin-left: 70%;
     padding-top: 5%;
    
    
   
}

/* estilo flecha volver*/
.fa-arrow-left{
    color: #593AFF;
    padding-top:500px;
    
}
    
    .menudesktop{
        display: none;
        
    }
    .bot_menu{
display:contents;
       
       
    
}
    
    
    

    
    /*cierra hamburguesa*/
    
    
   body{
   
      background-image: none !important;
      background-repeat: no-repeat;
      width: 100%;
       

    
     
}
  .tp header{
    
    display: flex;
    background-color: #593AFF;
    box-shadow:0px 0px 10px #222 inset;
    }
     
          
.celu {
    
    width: 100%;
    margin-right: 0%;
    margin-left: 0%;
    padding-bottom: 0%;
    text-align: center;
    margin-left: 0%;
    padding-left: 0%;
    

      
}
.appstore{
width:100%;
 text-align: center;
margin-left: 0%;
    margin-right: 0%
    
}
.appstore img{
  padding-top: 9%;
width: 70%
      
        
    
    
}
.texto1{

    width: 100%;
    height: 70%;
        }
    
    .texto1 h1{
     color: black;
    font-family: 'Rubik', sans-serif;
   
    text-transform: uppercase;
    font-size: 1.8rem;
         
        
       
        
    }       
  
    .texto1 p{
        color: black;
    }
    
    .info2{
     width: 100%;
     margin-top: 15%;
        padding-right:15% ;
        padding-left:15% 
     
              
    }
    
    .info2 p{
    
    }
    
    .info2 p br {
        display: none;
       
    }
    .info3{
  padding-top: 3rem;  
background-color: white;
}
  
 
.info4{
    padding-top: 3rem;  
    background-color: white;
    display: block;
    text-align: center;
    align-content: center;
    justify-content: center;
} 
    .info5{
        font-family: 'Rubik', sans-serif;    
        text-transform: uppercase;
        text-align: center;
        padding-top: 0%;
        margin-top: 20%
     

}
.info5 img{
padding-bottom: 5rem;
    width: 90%;
    
}
    
    footer{
  padding-right: 15%;
  padding-left: 15%;
    }  
    
 footer p {
    font-size: 14px;
    line-height: 20px;
    text-indent: 0px;
    text-align: center;
    margin: 0rem 0rem 0rem 0rem;
    
     
    /*margin-top: 60%;*/
     width: 100%
}   
    

    footer p br{
        display:none;
    }

    
    
.tp nav {
    /*align-content: flex;*/
   
    padding-top: 0rem;
    width: 50%; !important
    margin-left: 0%; 
    background-color: #593aff; 
    color:#ffffff; 
    position: absolute; 
    
    
    
    
}
.tp nav ul{
   /* display: flex;
    margin-top: 1rem;*/
    
	flex-direction: column; !important
	flex-wrap: nowrap; !important
    align-items: stretch;!important
	align-content: stretch;!important
    
}
.tp nav ul li{
   /* list-style-type: none;*/
    font-size: 30px; !important
        font-family: 'Lato', sans-serif;!important
    
}
.tp nav ul li a { 
    padding: 1rem;!important
    margin: 1rem 1rem 1rem 0rem;!important
   
    
    
    /*background-color: transparent;  puse transparente porque usa el mismo css, y en el resto tiene fondo blanco*/
    display: inline-flex;!important
    text-decoration: none; !important
    margin: 5rem; !important
    color: #ffffff;!important
    
  
}    
    

}