@import url('https://fonts.googleapis.com/css?family=Raleway:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i');


/* Valores univesales definidos*/

*{
    box-sizing: border-box;
    margin: 0 auto;
    padding: 0;
    font-family: "Raleway", sans-serif;
    font-weight: 300;
    text-align: center;
}

.Base{
    width: 80%;
    margin-top: 40px;
    margin-bottom: 40px;
    position: relative;
    
}

.row {
    display:flex;
    flex-wrap:wrap;
}

@media only screen and (min-width: 568px) {
    .Base{
        width: 90%;}
}

/* Menu navegador*/

nav {
    width: 100%;
    top:0;
    background: #120128;
    position: fixed;
    z-index: 900;
    box-shadow:0 0 5px rgba(0,0,0,0.8);
                -webkit-box-shadow:0 0 5px rgba(0,0,0,0.8);
                -moz-box-shadow:0 0 5px rgba(0,0,0,0.8);
                -ms-box-shadow:0 0 5px rgba(0,0,0,0.8);
                -o-box-shadow:0 0 5px rgba(0,0,0,0.8);
    padding: 15px 0;
}

nav .contenedor {
    width:90%;
    margin:0 auto;
    display: flex;
}

nav img{
    height: 60px;
    
}

#MENU{
    width: 30%;
    text-align: left;
}

#MENU a {
    text-decoration: none;
    color:black;
    font-weight: 600;
}

#MENU ul li{
    list-style: none;
    text-align: left;
}


#REDES{
    width:30%;
}


#REDES ul li{
    list-style: none;
    display: inline-block;
    float:right;
}

.logo {
    width:40%;
}


/* Header*/
header{
    background: url("../img/main-banner-app.jpg")20% no-repeat fixed;
    height: 90vh;
    top:-60px;
}

header .Base{
    position: relative;
    top:20%;
    bottom:10%;
}


h2{
    text-transform: uppercase;
    font-size: 2.6em;
    font-weight: 800;
    color: white;
    text-shadow: 0px 1px 8px black;

}

@media only screen and (min-width: 568px) {
    h2{
        font-size: 4em;}
}


h3{
    font-size: 3em;
    margin-top: 30px;
    margin-bottom: 30px;
    font-weight: 800;
    border: 10px solid #fabb51;
    
    color: black;
    background: #fabb51;
    
}

@media only screen and (min-width: 568px) {
    h3{
        font-size: 1.2em;
        width: 500px;
        background: none;
        border: none;
        color: aliceblue}
}
/* Franja Amarilla*/

#FRANJA{
background: #120128;
    height: 450px;
padding-top: 1px;    
padding-bottom: 1px;
padding-left: 30px;
    
}

@media only screen and (min-width: 568px) {
    #FRANJA{
        height: 250px;
        width: 100%;
    }

    
}

.botones img{
    border-radius: 2px;

}

h4{
    margin-top:5px;
    font-weight:800;
    font-size: 1em;
    
    
}

h4 span{
    font-size: 1em;
    font-weight: 700;
    color: white;
    text-shadow: 0px 1px 2px black;
}

.boton, .boton1 {
    width: 40%;
    float: left;
    position:relative;
    margin-right: 10%;}

@media only screen and (min-width: 568px) {
    .boton, .boton1 {
    width: 20%;
    float: left;
    margin-right:15px; }
    
    .boton1{top:-27px;
    float: left}

}

.boton1{margin-top: 30px;}


.par {width: inherit}


/* Qué es? */



#QUEES h4 {
    font-weight: 800;
    margin-top: 30px;
    margin-bottom: 0px;
    font-size: 1.2em;
    text-align: left;
}

#a {
    color: #3f9aba;
    }

#b {
    color: #fabb51;
    }

#c {
    color: #61bb97;
    }

.quees-img {
    width:50%;
}

.quees-img img {
    width: 62%!important;
}

.quees-texto {
    width:50%;
    margin-top:40px;
}

#QUEES p{
    font-size: 0.9em;
    text-align:left;
}

.pasos {
    width:50%;
    margin-top:70px;
}

.pasos h3 {
    margin-bottom:0;
}

.pasos h4 {
    margin:0 0 20px 0;
    color:#9d5572;
}

.paso {
    display:flex;
    width:100%;
    margin-bottom: 10px;
}

.paso-img {
    width:15%;
}

.paso-img img {
    width:50px;
}

.paso-texto {
    width:85%;
}

.paso-texto p {
    text-align: left;
    padding-top:7px;
    font-weight: 400;
}

.celfrente img{
    margin-top: 30px;
    width: 96%;
    display: block;
}


/* Fotocentro */


/* INSTRUCCIONES */

#INSTRUCCIONES{
    margin-bottom:50px;
}

.botonf{
    background: red;
    padding-top: 100px
}

.titulo8{
    text-align: center;
}

/* Twitter */
h5 {
    
}

    
}
#DESCUBRI h2{
    padding-top: 40px;
}
#DESCUBRI h4{
    padding-top: 40px;
    padding-bottom: 20px;
}



#TWITTER
{ background:#e22852;
    height: 250px;
    color: white;
    font-size: 1.3em;
    padding-top:1%;
    box-shadow:-2px 2   px 5px rgba(0,0,0,0.8);
                -moz-box-shadow:-2px -2px 5px rgba(0,0,0,0.8);
                -ms-box-shadow:-2px -2px 5px rgba(0,0,0,0.8);
                -o-box-shadow:-2px -2px 5px rgba(0,0,0,0.8);
    z-index: 700;
    
}




footer .Base{
    top: 20px;
}

@media (max-width: 776px) {
    .pasos, .quees-texto, .quees-img {
        width:100%;
    }
}

.botones .apple {padding-top: 62px;
    }

.video {padding-top: 85px


}


.contenedor-video {     

    padding-top: 30px;
    width: 55%;  

}