@import url('<link href="https://fonts.googleapis.com/css?family=Open+Sans" rel="stylesheet">');
/* selector { propiedad: valor;} */

body { font-family:'muli', sans-serif; width: 100%; margin: 0}

.contenedor:  { display: flex; width: 100%;}



header {position: relative; width: 100%;  min-height: auto; overflow-y: hidden; background color: aqua; background-repeat: no-repeat; width: 100%; background-size: cover; ;  background-repeat: no-repeat; width:100%; margin-bottom: 0; }

nav { background:  linear-gradient(to right, #31c0d1 , #77df5b); padding: 0.2rem; }
ul li {display: inline; font-family: roboto, arial, sans-serif;} 
li a:hover {background-color: #F99B4E; margin: 1.5rem; padding: 0.8rem; color: aliceblue;}
li a{list-style-type: none; text-decoration: none; line-height: 2rem; border-radius: 0.5rem; font-size: 0.9rem; margin: 2rem; font-family: roboto, arial, sans-serif; color: white;}
h3 a{list-style-type: none; text-decoration: none; line-height: 2rem; font-family: muli, arial, sans-serif; font-weight: normal; font-size: 1rem; color:white;  }

.container{position: relative;}
.container .textoHeader{position: absolute;top: 50%;left: 10%;}

header .container img{width: 100%;}

header div img {width: 20%;}


/*------Como funciona------*/

#como_funciona .a{background-color: #F89B51;color: white;padding: 2rem overflow: hidden;}

#como_funciona .a h2{color: #3C3C3B;font-weight: 600;}

#como_funciona h2{text-align: center; margin: .5em;}

#como_funciona p{text-align: center;margin: 1em;}

#como_funciona img{ margin: auto;display: block;}

#como_funciona div p{padding: .1em .5em; font-weight: 800;font-size: 1.5em;margin: 0;}

#como_funciona .b{background-color: #00B5B8;color: white;padding: 2emoverflow: hidden;}

#como_funciona .b h2{color: #3C3C3B;font-weight: 600;}

#como_funciona .c{ background-color: #7BDD5B; color: white; padding: 2em overflow: hidden;}

#como_funciona .c h2{ color: #3C3C3B; font-weight: 600;}

como_funciona .d{background-color: white; color: #052030; padding: 3em; height: 200px; overflow: hidden;}


article {font-size: 1.2rem; color: #3C3C3B; }


.descargas a {padding: 0px 50px; text-decoration: none;}


footer {
    text-align: center; padding: 2rem;
    font-weight: 400;
    font-size: 12px; color: white;
    background-color: #3C3C3B; }



/* mobile */

@media screen and (max-width:30rem) {
 
header { min-height: 450px; }
    
.mini { height: 30px; padding-left: 41px; }
    
.nav {width: 100%;
      box-sizing: border-box; 
      margin-top:0px; padding: 1px 0px; 
      font-size: 13px; }
    
header .nav ul { flex-direction: column; justify-content:center; padding: 0px;  margin: 6px 0px 30px 0px; }
header .nav ul li {padding: 5px 8px;}
header .nav li a {padding: 0.3rem 1rem 0.3rem 1rem; font-size: 12px; }

    
.android, .ios { width:150px; padding-top: 15px; }
    
footer{ font-size: 10px;} }