* {
    font-family: 'Montserrat', sans-serif;
    margin: 0;
    padding: 0;
    box-sizing:border-box;
    max-width: 100%;
    list-style: none;
    text-decoration: none;
    outline: none;
}



a {
    color: black;
}



body {
    min-height: 120vh;

}

.menufijo {
    background-color: black;
    color: white;
    width: 100%;
    position: fixed;
    right: auto;
    left: auto;
    bottom: 0;
    padding-left: 3.3em;
    padding-right: 3.3em;
    padding-bottom: 0.7em;
    padding-top: 0.7em;
    margin-bottom: 0;
    display: flex;
    justify-content: space-between;
    margin: auto;
}

.menufijo a{
    color:white;
}

#btnagenda, #btnemail, #btnperfil, #btnmapa, #btnhamburguesa, #btnclose  {
    font-size: 36px;
}



header {
    background-color: black;
    color: white;
    display: flex;  
    justify-content:space-between;
    align-content: center;
}

header a{
    color:white;
    text-decoration: none;
}



header nav ul {
    background-color: rgba(0,0,0,0.65);
    font-size: 0.8em;
    margin-top: 0;
}



header nav ul li a {
    color: white;
    margin-top: 0.8em;
    padding: 0.7em;
    display: flex;
    justify-content:flex-start;
    align-items: center;
    border-bottom: solid .01em;

}



header nav ul li a:hover {
    color: #00a5ff;

}



[type="checkbox"]:not(:checked), [type="checkbox"]:checked {
    display: none;
}



header nav label {
    cursor: pointer;
    padding: 0em;
    position: relative;
    z-index: 9999;
}


#btnhamburguesa, #btnclose {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 0.4em;
    color: #00a5ff;
    float: left;
    
}






#menu-toggle:not(:checked) + #llamamenu,
#menu-toggle:checked + #llamamenu + #ocultamenu {
    display: flex;
}


#menu-toggle:checked + #llamamenu,
#menu-toggle:not(:checked) + #llamamenu + #ocultamenu {
    display: none;
}



header nav ul {  
    position: fixed;
    right:100%;
    top: 5em;
    width: 50%;
    height: 100vh;
    z-index: 9990;
    padding: 1em;
    transition: all .5s ease;
}


#menu-toggle:checked + #llamamenu + #ocultamenu + ul {
    right: 50%;
    transition: all .25s ease;
}



header h1 {
    padding: 0.4em;
    font-size: 1.5em;
    justify-content: center;
    align-self: center;
    font-weight: 800;
    margin-left: auto;
    margin-right: auto;
}



.contacto2 {
   background-color: #00a5ff;
    padding: .5em;
    border-radius: .5em;
    display: flex;
    flex-direction:row;
    margin-bottom: 55px;
    margin-top: 8px;
    justify-content: space-around;
    font-size: 13px;
    
    
}
.contacto2 p {
    padding: .8em;
    color: black;
    font-weight: 500;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-content: center;
    align-items: center;
    flex-wrap: wrap;
}

.contacto2 i {
    margin-bottom: 10px;
    color: black;
    margin-top: 3px;
}

.contacto2 img {
    width:60px;
    padding: 8px;
    margin-top: .7em;

    
}
.videoindex {
    width: 100%;
    margin-top: 25px;
    border-radius: .5em;
    margin-bottom: 5px;
}




#btnperfil {
    display: flex;
    flex-direction: column;
    justify-content:flex-end;
    padding: 0.4em;
    right: 0em;
    float: right;
}


main{
    padding:10px 0 20px 0;
    height: auto;
    margin: 1em 1.5em 0.5em 1.5em;
}


.tellevo {
    padding: 2.5em;
    color: black;
    font-size: 1.1em;
    font-weight: 800;
    background-color: #00a5ff;
    text-align:center;
    text-transform: uppercase;
    border-radius: 0.5em;
    margin-bottom: 10px;
    margin-top: 10px;
}

.llevame {
    padding: 2.5em;
    color: black;
    font-size: 1.1em;
    font-weight: 800;
    background-color: #00a5ff;
    text-align:center;    
    text-transform: uppercase;
    border-radius: 0.5em;
    margin-bottom: 10px;

}


.viajeenvivo{
    position: relative;
    border: solid .3em #00a5ff;
    border-radius: 0.5em;
    
}


.envivo {
    color: black;
    font-size: 0.5em;
    font-weight: 700;
    text-transform: uppercase;
    background-color:#00a5ff;
    padding: 0.7em;
    border-radius: 0.3em;
    position: absolute;
    right: 1em;
    margin: 2em;
}







    /*------------ HOLA // INDEX  ----------*/


.intro {
    background-color: rgba(0,165,255,0.3);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-content: center;
    text-align: center;
}



.hola {
    font-weight: 800;
    margin-bottom: 0.5em;
    

}

.bienvenidos {
    font-weight: 500;
    font-size: 1.4em;
    margin: 0em 3em 1em 3em;

}


#introduccion {
    color: black;
    font-size: 0.95em;
    font-weight: 300;
    margin-bottom: 5em;
}


.btngeneral {
    padding: .4em;
    background-color: #3250ff;
    border-radius: .5em;
    font-weight: 600;
    font-size: .9em;
    display: flex;
    justify-content: center;
    text-transform: uppercase;
    color:white;

}


.sosnuevo {
    color: black;
    font-weight: 500;
    margin-top: .5em;
}


#registrate {
    text-decoration: underline;
    color: #3250ff;
}


.btngeneral > a {
    color: white;
}

.gif {
    width: 50%;
    margin-left: 27%;
    margin-top: 150px;
}

    /*------------ INICIAR SESION 2  ----------*/


#introdos {
    background-color:rgba(0, 165, 255, 0.25);
}


#usuario {
    padding: .7em;
    border-style: none;
    border-radius: .5em;
    margin-bottom: .8em;
}


#clave {
    padding: .7em;
    border-style: none;
    border-radius: .5em;
    margin-bottom: 2em;

}


#iniciosesion{
    display: flex;
    flex-direction: column;
    margin: 1em;
    margin-top: 3em;
    
}


#soynuevo, #olvide {
    color: #3250ff;
    text-decoration: underline;
    font-weight: 500;
}


#abajo {
    margin: 1em;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    

}

.googlemapss {
      border: solid .3em #00a5ff;
    border-radius: 0.5em;
    width: 100%;
    display: flex;
    align-self: center;
    margin: auto;
    margin-top: 20px;
}

/*------------ CONTACTO ----------*/

.googlemaps {
    border: solid .3em #00a5ff;
    border-radius: 1em;
    width: 100%;
    display: flex;
    align-self: center;
    margin: auto;
    margin-top: 20px;
    
}


/*------------  TE LLEVO // MIS VIAJES  ----------*/


.mas {
    position: fixed;
    width:60px;
    height: 60px;
    border-radius: 100px;
    background: #3250ff;
    bottom: 80px;
    right:5px;
    display: flex;
    justify-content: center;
    box-shadow:  1px 2px 3px rgba(0, 0, 0, 0.4);
}



.mas i{
    font-size:3.3em;
    color:white;
    align-self: center;
    font-weight: 600;
}


.tit-tellevo {
    display:flex;
    justify-content: space-between;
    align-items: flex-end;
    align-content: center;
    color:#000;
    position: relative;
    margin-bottom: 0;
}

.tit-tellevo h2 {
    color:#000;
    font-weight: 600;
}

.tit-tellevo img{
    width:25px;
    
}

.tarjeta {
    width: 100%;
    background-color:rgba(0, 165, 255, 0.55);
    border-radius:0.5em;
    padding: 20px;
    color:black;
    
    display: flex;
    justify-content:space-between;
    align-content: center;
    align-items: center;
    margin-top: 10px;
}

.tarjeta h3 {
    font-size: 20pt;
    font-weight: 600;
}

.tarjeta p {
    color: black;
}


.tarjeta i{
    background: none;
    border:0;
    color:black;
    margin: 0;
    padding: 0;
}

.desplegar i{
    font-size: 50pt;
}

.car, .bici {
    font-size: 30pt!important;
    width: 55px;
}


.infoviaje {
    padding: .1em;
    margin-top: .5em;
    display: flex;
    flex-direction: row;
    align-items:flex-end;
    width: 100%;

}


.lugares p {
    font-size: .7em;
}

.tarjeta-info > div > p {
    font-size: .9em;
    font-weight: 500;
}




.lugares .persons1, .lugares .persons2, .lugares .persons3 {
    color: rgba(50, 80, 255, 0.35);
    
}


.persons1:nth-child(2),.persons1:nth-child(3){
    color:rgba(50, 80, 255)!important;
}

.persons2:nth-child(2) {
    color:rgba(50, 80, 255)!important;
}


.persons3:nth-child(2),.persons3:nth-child(3),.persons3:nth-child(4){
    color:rgba(50, 80, 255)!important;
}




.filtro{
    display: none;
    position: absolute;
    right: 0;
    top:30px;
    background:#212121;
    color:#fff;
    padding: 10px;
    border-radius: 0.3em;
    text-decoration: none;
}

.filtro p{
    color:#00a5ff;
    font-weight: 600;
    margin-bottom: 20px;
}

.filtro li{
    margin-bottom: 10px;
    text-decoration: none;
    color: white;
}



.yollevo, .me-llevan {
    text-transform: uppercase;
    margin-top: 2em;
    color: #3250ff;
    font-weight: 800;
    padding: .5em;
    border-top: solid .18em;
    border-color: #3250ff;

}


.ultimo{
    margin-bottom: 3.5em;
}




 /*------------ TELLEVO-MASINFO  ----------*/
#ssolicitud 
    {
        margin-top: 10px;
    border: solid #3250ff;
    border-radius: 1em;
    min-width: 350px;
    min-height: 90px;
    padding: 1.5em;
}

    

#vacante {
   background-color: rgba(0,165,255,0.3);
    padding: 8px;
    border-radius: .5em;
    color: black;
    border-color:rgba(0,165,255,0.3); 
    width:350px;  
	border:0px;
    font-size: 15px;
    font-weight: 200;
    margin-bottom: 15px;
    display: flex;
}
.misviajes-masinfo {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-content: center;
    align-items: center;
    margin-bottom: .7em;
    text-transform: uppercase;
}

.volver i {
    font-size: 30pt;
    
}

.tarjeta2 {
    width: 100%;
    background-color:rgba(0, 165, 255, 0.55);
    border-radius:0.5em;
    padding: 20px;
    color:black;
    margin-bottom: 3em;
    position: relative;
    
}

#editar {
    position: absolute;
    right: 1.3em;
}

.tarjeta2 p {
    font-size: .7em;
    color: black;
    margin: 0;
}


.informacion h3 {
    margin: 0;
    margin-bottom: .7em;
}


.transporte p {
    font-size: .7em;
    color: black;
    margin: 0;
    margin-bottom: .3em;
}

#ford {
    background-color:rgba(0, 165, 255, 0.7);
    text-decoration: none;
    color: black;
    padding: .6em;
    border-radius: .5em;
    font-size: .8em;
    line-height: 1.3em;
    margin-top: .3em;
}


.tarjeta2 iframe {
    border-radius: .5em;
    margin-top: 1em;
    margin-bottom: 2em;
}




#cupos {
    display: flex;
    flex-direction: column;
    margin-bottom: 1em;
}


#cupos i {
    color: rgba(50, 80, 255, 0.35);
    margin-bottom: .1em;
    margin-top: .5em;
}


#cupos i:nth-child(1), #cupos i:nth-child(3)  {
    color:rgba(50, 80, 255)!important;

}


#cupos .ocupado {
    font-weight: 500;
    font-size: .8em;
    padding: .8em;
    background-color: rgba(50, 80, 255, 0.35);
    border-radius: .5em;
}


#cupos .vacio {
    font-weight: 500;
    font-size: .8em;
    color: rgba(50, 80, 255, 0.35);
    padding: .8em;
    background-color: rgba(255, 255, 255, 0.35);
    border-radius: .5em;
}


    

	 /*------------ LLEVAME  ----------*/



 .llevametit {
     text-transform: uppercase;
     margin-bottom: 1em;
        
    }

#btnsolicitudes {
    position: fixed;
    width:60px;
    height: 60px;
    border-radius: 100px;
    background: #3250ff;
    bottom: 80px;
    right: 132px;
    display: flex;
    justify-content: center;
    box-shadow: 1px 2px 3px rgba(0, 0, 0, 0.4);
}


#btnsolicitudes i {
    font-size: 2.4em;
    color:white;
    align-self: center;
}

#lista-solicitudes2 {
    display: none;
}

	 /*------------ LLEVAME - MAS INFO  ----------*/


.btngeneral {
    padding: .4em;
    background-color: #3250ff;
    border-radius: .5em;
    font-weight: 600;
    font-size: .9em;
    display: flex;
    justify-content: center;
    text-transform: uppercase;
    color:white;
        
    }


.btngeneral > p {
    color: white;
    font-size: 1em;
}



	 /*------------ UBICACION // MAPA ----------*/

.mapabarrio {
    border-radius: 0.5em;
    
}

.mapabarrio h2 {
    margin-bottom: .8em;
}


    /*------------ PERFIL  ----------*/



.perfil h2{
    color:#000;
    font-weight: 700;
    text-transform: uppercase;
    margin-bottom: .6em;;
    
}

.claudiaduval {
    background-color:rgba(162, 107, 255, .6);
    border-radius: 0.5em;
    padding: 1.5em;
    padding-top: 3em;
    margin-bottom: 3em;
    
}

#extra {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    width: 75%;
    height: 35%;
    position: absolute;
    
}

#extra i {
    font-size: 2em;
}

.claudiaduval img {
    display: flex;
    align-content: center;
    width: 100px;
}

.miinfo {
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    align-content: center;
    align-items: center;
    margin-bottom: 1em;
}


.iconos i {
    color: #a090b1;
    font-size: 2em;
    color: #a26bff;
}


.iconos p {
    background-color: #a26bff;
    padding: 0.7em;
    border-radius: 0.5em;
    margin-bottom: 20px;
    font-size: 13px;
}



.miauto {
    background-color: #a26bff;
    padding: 0.7em;
    border-radius: 0.5em;
    margin-bottom: 20px;
    font-size: 13px;
    text-decoration: none;
    color: black;
    margin-top: 0em;
    
}





/*------------ PERFIL AMIGO // MARCOS  ---------*/


.tit-misamigos {
    display: flex;
    flex-direction: row;
    align-items:center;
    align-content: flex-start;
    justify-content: flex-start;
}



#marcosimg {
    border-radius: 50%;
    border: solid #a26bff;
    
} 


/*------------ MIS AMIGOS contactos ----------*/

.tit-misamigos {
    display: flex;
    justify-content: space-between;
    margin-bottom: 20px;
    text-transform: uppercase;
}
.contactos img {
    width: 100px;
    height: 100px;
    border-radius: 50%;
    border: solid .2em;
    border-color:rgba(162,107,255);
    margin: 0;
    margin-right: 1em;
   
}
.contactos {
    width: 100%;
}
.amigo1, .amigo2, .amigo3, .amigo4 {
    background-color: rgba(162,107,255,.4);
    padding: .6em;
    margin-bottom: 20px;
    border-radius: 0.5em;

    display: flex;
    flex-direction: row;
    justify-content: space-around;
    align-content: center;
    align-items: center;
    
    position: relative;
}

.info-amigo {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-content:flex-start;
    align-items: flex-start;
}

.hijos {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center
}



.amigo1, .amigo2, .amigo3, .amigo4 p {
    font-size: .75em;
}

.contactos i {
    color: #a26bff;
}


.desplegar-amigos i{
    font-size: 50pt;

    
}


.mapamarcos {
    display: none;
}



/*------------ CHATS ----------*/

.tit-chats {
    display: flex;
    justify-content: space-between;
    margin-bottom: 20px;
    text-transform: uppercase;
    
}

.tit-chats i {
    color: #a26bff;
}

.chat1, .chat2, .chat3 {
    border: solid .2em;
    border-color:rgba(162,107,255);
    border-radius: 0.5em;

    padding: .6em;
    margin-bottom: 20px;
    
    display: flex;
    flex-direction: row;
    justify-content: space-around;
    align-content: center;
    align-items: center;
    
}


.foto-nombre {
    display: flex;
    padding: 0;
    margin: 0;
    flex-direction: row;
    justify-content:flex-start;
    align-content: center;
    align-items: flex-start;
}


.chats img {
    width: 100px;
    height: 100px;
    border-radius: 50%;
    border: solid .2em;
    border-color:rgba(162,107,255);
    margin: 0;
    margin-right: 1em;
   
}


.desplegar-chat i {
    font-size: 50pt;

}


.chats p {
    font-weight: 300;
    font-size: .7em;
    color: #a26bff;
    
}

.chats a {
    font-weight: 600;
}

.chats article {
        font-size: .7em;

}

/*------------ armar viaje ----------*/

.btnarmarrr {

    border:2px solid #3250ff;
     padding: .4em;
    color: #3250ff;
    background-color: white;
    border-radius: .5em;
    font-weight: 500;
    font-size: 16px;
    display: inline;
    justify-content: center;
    text-align: center;
    margin-left: 30%;
    margin-bottom: 30px;
    margin-top: 20px;
}
.btnarmarr {
    padding: .4em;
    color: white;
    background-color: #3250ff;
    border-radius: .5em;
    font-weight: 500;
    font-size: 18px;
    display: inline-block;
    justify-content: center;
    text-align: center;
    margin-bottom: 30px;
  margin-top: 20px;
}

.iconosarriba {
    display: flex;
    color:darkgray;
    margin-top: 5px;
}

.bike {
    margin-top: 13px;
    margin-right: 80px;
}
.bike:hover {
    color: black;
}
.walk {
    margin-top: 12px;
    margin-right: 70px;
    margin-left: 20px;
}
.walk:hover {
    color: black;
}

.car:hover {
    color: black;
}
#desde {
   background-color: rgba(0,165,255,0.3);
    padding: 8px;
    border-radius: .5em;
    color: black;
    border-color:rgba(0,165,255,0.3); 
    width:350px;  
	border:0px;
    font-size: 15px;
    font-weight: 200;
    margin-bottom: 15px;
}

#hasta {
 background-color: rgba(0,165,255,0.3);
    padding: 8px;
    border-radius: .5em;
    color: black;
    border-color:rgba(0,165,255,0.3); 
    border:0px;
    width:350px;
    font-size: 15px;
    font-weight: 200;
     margin-bottom: 15px;
}
#hastaa {
    background-color: transparent;
    padding: 8px;
    border-radius: .5em;
    color: black;
    border-color:rgba(0,165,255,0.3); 
    border:0px;
    width:350px;
    font-size: 15px;
    font-weight: 200;
     margin-bottom: 15px;
     border:3px solid rgba(0,165,255,0.3);
    
}
.tituloh4 {
     font-size: 18px;
    font-weight: 500;
     margin-bottom: 10px;   
}
#dg {
   width: 30px;
    
}
#diys {
   width: 30px;
    
}

.add {
    width: 20px;
    color:darkgray;
}
.add :hover {
    color: black;
}


.listado {
    display: block;
     background-color: rgba(0,165,255,0.3);
    padding: 8px;
    border-radius: .5em;
    color: black;
    border-color:rgba(0,165,255,0.3); 
    border:0px;
    width:350px;
    font-size: 15px;
    font-weight: 200;
    margin-bottom: 15px;
}

#listado {
    padding: 8px;
     border-radius: .5em;
    border:3px solid rgba(0,165,255,0.3);
    width:350px;
    height: 100px;
    font-size: 15px;
    font-weight: 400;
    margin-bottom: 10px;
    
}

.mapaarmarviaje {
    width: 100%;
    border-radius: .5em;
    margin-top: 10px;
    border:3px solid rgba(0,165,255,0.3);

}


/*------------ armar viaje 1----------*/

form {
    padding: 1em;
    border-radius: .5em;
}
#fechahora {
    border: 0px;
    display: block;
    margin-left: 0;
    padding: 0;
    
}


#lugares {
    background-color: rgba(0,165,255,0.3);
    padding: .5em;
    border-radius: .5em;  
    margin-top: 15px;
    border: 0px;
}

.block {
    display: block;

}



#dni {
    background-color: rgba(0,165,255,0.3);
    padding: .5em;
    border-radius: .5em;
    display: block;
    margin-top: 15px;
    border: 0px;
    
}

#modelo { 
background-color: rgba(0,165,255,0.3);
    padding: .5em;
    border-radius: .5em;
    display: block;
    margin-top: 15px;
    border: 0px;
     }
#carnet { 
background-color: rgba(0,165,255,0.3);
    padding: .5em;
    border-radius: .5em;
    display: block;
    margin-top: 15px;
    border: 0px;
     }
#patente { 
background-color: rgba(0,165,255,0.3);
    padding: .5em;
    border-radius: .5em;
    display: block;
    margin-top: 15px;
    border: 0px;
     }
    
#fechahora {
    margin-top: 15px;
    background-color: rgba(0,165,255,0.3);
    padding: 1.5em;
    border-radius: .5em;
    margin-left: 80px;
    font-size: 15px;
    
}

h3 {
    font-size: 15px;
    margin-top: 10px;
}

.aniadirpersona {
    height: 25px;
    margin-top: 10px;
}


.aniadirpersona a span{
    font-size: 12px;
    color: dodgerblue;
    font-weight: 600;
    text-decoration: underline;
}


.aniadirpersona i {
    padding: .1em;
    color: dodgerblue;
    float: left;
}


/*------------ armar viaje 2---------*/

.terminado i {
    display: flex;
    justify-content: center;
    color: white;
    margin-top: 10px;
}
.terminado { 
    color: white;
    background-color: #00a5ff;
    border-radius: 1.5em;
    padding: 1.5em;
    justify-content: center;  
    
    position: absolute;
    left:50%;
    margin-left: -130px;
    top:38%;
    margin-top:0px;
    width: 280px;
    font-size: 15px;
    
}

.difuminado {
    filter: blur(2px);
}



/*------------ info ---------*/


.titulovideo {
     text-transform: uppercase;
    text-align: center;
}
.videoinfo {
    width: 100%;
    margin-top: 20px;
    border-radius: 0.5em;
}
 
.infoapp {
    color: black;
    text-decoration: none;
    background-color: rgba(0,165,255,0.3);
    padding: 1em;
    border-radius: 0.6em;
    margin-top: 20px;
}
.infoapp h3 {
    font-size: 20px;
    font-weight: 500;
    
} 
.infoapp p {
    margin-top: 10px;
    background-color: ;
    padding: 1em;
    border-radius: 0.6em;
    color: dodgerblue;
    font-size: .95em;
}

.leyesviales {
    color: black;
    text-decoration: none;
    background-color: rgba(0,165,255,0.3);
    padding: 1em;
    border-radius: 0.6em;
    margin-top: 20px;
    font-size: .95em;

}

.leyesviales p {
    margin-top: 10px;
   
    padding: 1em;
    border-radius: 0.6em;
    color: dodgerblue;
}

.leyesviales h3 {
    font-size: 20px;
   font-weight: 500;
}
.leyesviales a {
    color: white;
}


.popup {
    background-color: #ffffff;
    color: #888888;
    height: 245px;
    left: 100%;
    padding: 20px;
    position: fixed;
    right: 30%;
    top: 25%;
    width: 550px;
    z-index: 101;
    -moz-box-shadow: 0px 0px 10px 1px #888888;
    -webkit-box-shadow: 0px 0px 10px 1px #888888;
    box-shadow: 0px 0px 10px 1px #888888;
    border-radius:10px;
    -moz-border-radius:10px;
}
 
.overlay {
    background: #000000;
    bottom: 0;
    left: 0;
    position: fixed;
    right: 0;
    top: 0;
    z-index: 100;
    opacity:0.5;
}
 
a.close {
    background: url("cancel.png") repeat scroll left top transparent;
    cursor: pointer;
    float: right;
    height: 26px;
    left: 32px;
    position: relative;
    top: -33px;
    width: 26px;
}



    /*------------ ARMAR SOLICITUD  ----------*/

#solicitud {
    border: solid #3250ff;
    border-radius: 1em;
    min-width: 300px;
    min-height: 300px;
    padding: 1.5em;
}

form {
    padding-top: 0.3em;
}


#publicar {
    position: absolute;
    font-size: 1em;

    left:36.2%;
    margin-left:-100px;
    top:70%;
    margin-top: 0px;
    width: 300px;     
}



    /*------------  SOLICITUDES  ----------*/


.solicitud1, .solicitud2, .solicitud3 {
    background-color: rgba(0,165,255,0.3);
    border-radius:0.5em;
    padding: 1em;
    margin-bottom: .7em;
}

#lista-solicitudes h3 {
    font-size: 1.1em;
    font-weight: 600;
    margin: 0;
}


#lista-solicitudes p {
    font-weight: 400;
    font-size: .9em;
    margin-bottom: 1em;
    margin-top: .2em;
}


/* 

.tarjeta {
    width: 100%;
    background-color:rgba(0, 165, 255, 0.55);
    border-radius:0.5em;
    padding: 20px;
    color:black;
    
    display: flex;
    justify-content:space-between;
    align-content: center;
    align-items: center;
    margin-top: 10px;
}

.tarjeta h3 {
    font-size: 20pt;
    font-weight: 600;
}

.tarjeta p {
    color: black;
}

*/

/*------------MEDIA--------------*/

@media (min-width: 1280px) { 

  
    
    #menu-toggle, #menu-toggle:checked + #llamamenu, #menu-toggle:not(:checked) + #llamamenu, #menu-toggle:checked + #llamamenu + #ocultamenu, #menu-toggle:not(checked) + #llamamenu + #ocultamenu, #btnclose  {
        display: none
    }
    

    header nav ul { 

    display: flex;
    flex-direction: row;
    justify-content:flex-end;

        
    position: absolute;
    right: 5em;
    top: auto;
    width: 100%;
    height: auto;
    z-index: 999;
    background-color: transparent;
    font-size: 0.9em;
}
    .googlemapss {
        width: 50%;
    } 
    header h1 {
        display: flex;
        position: absolute;
        left: 3.5em;
    }
    .videoindex {
     display: none;
    }
   
    
    /*
    

    header nav {
    display: flex;

    background-color: transparent;
    margin: 0;  
    margin-top: 0.5em;
    padding: 0.5em;
    height: 3em;    
   
    }
    
        
    
    header nav ul {  
    position: absolute;
    right: auto;
    top: auto;
    width: 100%;
    height: auto;
    z-index: 999;
    padding: 0 50px 0 50px;
    font-size: 0.9em;
}
    
    
    header nav ul li {
        float:left;   
        position: relative;
    }
    
    
    
    
    
  .iconosham {
        display: none;
    } 
    
    header nav {
    background-color: transparent;
    margin: 0;  
    margin-top: 0.5em;
    padding: 0.5em;
    height: 3em;    
    right: 0em;
    display: flex;
   
    }
    
    
    header nav ul {
    overflow: hidden;
    position: inherit;
    }
    
    header nav ul {  
    position: absolute;
    right: auto;
    top: auto;
    width: 100%;
    height: auto;
    z-index: 999;
    padding: 0 50px 0 50px;
    transition: all .5s ease;
    background-color: transparent;
    font-size: 0.9em;
}
    
    
    header nav ul li {
        float:left;   
        position: relative;
    }
    
    
    */



header nav ul li a {
    color: white;
    padding: 0;
    padding-left: 60px;
    border-bottom: none;
    font-weight: 500;

}
  /*  .segundo {
        padding-right: 450px; 
    }

  */ 
    
    .principal {
    display: flex;
    flex-wrap: wrap;
    margin: 1em;
    justify-content: flex-start;
    align-items:baseline;
    max-width: 100%;
        
	}  
    
    .cuadroviajes {
        float: left;
        width: 50%;
        padding: 0 50px;
            
    }
    
    
    .viajeenvivo {
        float: left;
        width: 50%;
        top: 10px;
    }
    
    .armarviaje, .necesitotransporte, .tengotransporte, .misviajes {
    }
    
    main{
        margin:1em 1.5em 0.5em 6em;
    }

    .menufijo {
        height: 100%;
        width: 70px;
        flex-direction: column;
        padding: 0;
        padding-left: 18px;
        padding-top: 80px;
        justify-content: flex-start;
    }
    .menufijo i {
        margin-bottom: 40px;
    }
      
    .tellevo {
        float: left;
        padding: 2.5em;
        color: black;
        font-size: 1.1em;
        font-weight: 800;
        background-color: #00a5ff;
        text-transform: uppercase;
        border-radius: 0.5em;
        margin-bottom: 25px;
        width: 100%;
    }
    .llevame {
    float: left;
    width: 100%;
    padding: 2.5em;
    color: black;
    font-size: 1.1em;
    font-weight: 800;
    background-color: #00a5ff;
    text-align:center;    
    text-transform: uppercase;
    border-radius: 0.5em;
    margin-bottom: 10px;


    }
    
    .btngeneral {
        width: 70%;
        position: relative;
        left: 15%;
    }

    #abajo {
        width: 25%;
        position: relative;
        left: 38%;
    }
    
    #sesion {
        width: 50%;
        position: relative;
        left: 21%;
    }
    
    .claudiaduval {
        width: 50%;
        position: relative;
        left: 21%;
    }
    
    /*----misamigos---*/
    
    .amigo1{ 
    float:left;
    display: flex;
    flex-wrap: wrap;
    margin-right: 3em;
    justify-content: flex-start;
    align-items:flex-start;
    width: 500px;
    height: 400px;
   padding-top: 0em;
        padding-left: 1em;
        border: solid .2em;
    border-color:rgba(162,107,255);
    }
    
    
    .amigo2, .amigo3, .amigo4 {
        
        width: 100;
    
    }
    
    .mapamarcos {
         display: flex;
        margin-top:3em;
        margin-right: 1em;
        margin-left: .5em;
        width: 100%;
        border: solid .2em;
    border-color:rgba(162,107,255);
    }
   
    /*---misviajes---*/
    
    
    
    .yollevo1 {
        width: 40%;
        display: flex;
        flex-direction: column;
        float: left;
        margin-right: 2em;
    }
    
    .mellevan1 {
         width: 40%;
        display: flex;
        flex-direction: column;
    }
   .mas {
    position: fixed;
    width:80px;
    height: 80px;
    border-radius: 100px;
    background: #3250ff;
    bottom: 80px;
    right:80px;
    display: flex;
    justify-content: center;
    box-shadow:  1px 2px 3px rgba(0, 0, 0, 0.4);
}



.mas i{
    font-size:3.3em;
    color:white;
    align-self: center;
    font-weight: 600;
}

    
/*----viajes de mis amigos-----*/
    
    .tarjetasviajesamigos {
        width: 50%;
        float: left;
    }
    
    #btnsolicitudes {
        display: none;
    }
    
    #lista-solicitudes2 {
        display: flex;
        flex-direction: column;
        padding-left: 2em;
        padding-top:1em;
        width: 50%
    }
}