body{
    background-color: #23BCEF;
    min-height: 100vh;
}

/*PANTALLA0-INDEX*/

.logocarga{
    max-width: 200px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 50%;
}

.logoindex{
    width: 100%;
}


/*PANTALLA01*/

.cero{
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    border: 0;
}

main.principales {
	margin: 0;
	padding: 2em;
}

.primeras{
    display: flex;
    flex-direction: column;
    align-items: center;
}

#pag2 {
	display: none;
	}

#pag3 {
	display: none;
	}

.crea{
    width: 50%;
}

/*texto*/
.titulosprin {
    font-family: 'Poppins', sans-serif;
    color: white;
    font-weight: 900;
    font-size: 2em;
    margin-top: 0.8em;
    margin-bottom: 0;
}

.textoprin {
    font-family: 'Rubik', sans-serif;
    color:white;
    font-size: 0.8em;
    margin-top: 0em;
    text-align: center;
}


/*puntos*/
.puntito1 {
  height: 1em;
  width: 1em;
  padding: 0.2em;
  margin-right:1em;
}

.puntito2 {
  height: 1em;
  width: 1em;
  padding: 0.2em;
  opacity: 0.5;
margin-right: 1em;
}

.puntitos{
  display: flex;
  flex-direction: row;
}


/*botonomitir*/
.botonomitir2 {
  font-family: 'Poppins', sans-serif;
  color:#23BCEF ;
  font-weight: 900;
  font-size: 1em;
  text-decoration: none;
}

.botonomitir {
  padding:1em;
  background-color: white;
  border-radius: 5em;
  margin-top: 2em;  
}

.botonomitir:hover{
    background: #1385C8;
    color:white;
}



/*PANTALLA1-INICIO*/


.logobuscainiciasumate{
    width:50%;
}

.headerinicio{
    margin-top: 10em;
    margin-bottom: 5em;
}

.headerinicio, .sectioninicio{
    display: flex;
    justify-content: center;
    align-items: center;
}

.busca, .iniciarsesion, .sumate {
    font-family: 'Rubik', sans-serif;
    font-size:0.9em;
    font-weight:bold;
    color:#23BCEF;
    background:white;
    border-radius: 50em;
    width:200px;
    height:50px;
    border: none;
    margin-left: 1em;
    margin-right: 1em;
    justify-content: space-between;
    margin-top: 1em;
}

.busca:hover, .iniciarsesion:hover, .sumate:hover{
    background: #1385C8;
    color:white;
}



/*PANTALLA2-BUSCAR*/

.estasbuscando{
    font-family: 'Rubik', sans-serif;
    color:white;
    font-weight: 900;
    margin-top: 2em;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    font-size: 0.9em;
    margin-bottom: 2em;
}

.busqueda2{
    display: flex;
    justify-content: center;
    align-items: center;
}

.galeria{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin-bottom: 5em;
}
 
.galeria figure{
    width: 50%;
    margin-right: .3em;
    margin-top: 0em;
}

.galeria img{
    width: 100%;
}

.galeria figcaption{
    font-size: 1em;
    text-align: center;
    color: white;
    font-family: 'Poppins', sans-serif;
    margin-top: 0.5em;
}

.botonflotante1 a{
    color:white;
    text-decoration: none;
}

.entra, .sumate1{
    font-family: 'Poppins', sans-serif;
    font-size:0.8em;
    border-radius:5em;
    width:30%;
    border: none;
    text-align: center;
    font-weight: 700;
    padding:1em;
    top: 90%;
    position: fixed;
    z-index: 9999;
}

.entra{
    background:black;
    bottom: 2em;
    left: 2em;
    margin-bottom: 0em;
}

.sumate1{
    right: 2em;
    left: auto;
    background: #1385C8;
}

.entra:hover{
    background: #1385C8;
    color:white;
}

.sumate1:hover{
    background:black;
}



/*PANTALLA3-BUSCARMENU-BARRA-BOTONATRAS*/

/*MENU*/
.pantalla3{
    background:#23BCEF;
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    border: 0;
    margin-top: 5em;
}

ul {
    list-style: none;
}

.menu{
    background-color: white;
    font-family: 'Poppins', sans-serif;
    position: fixed;
    top: 0;
    width: 100%;
    height: 10%;
    z-index: 3;
    font-size: 1em;
}

#llamamenu .material-icons,
#ocultamenu .material-icons {
    padding-right: 0;
}

.contenedor{
    padding: 0.8em;
}

.menu, .contenedor {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.menu nav{
    background-color:#23BCEF;
}

.menu nav a{
    margin-left: -2em;
}

.menu nav a,
.menu nav label {
    color: white;
    padding: .5em 1em;
    text-decoration: none;
    display: flex;
}

[class="menudesplegado"]:not(:checked), [class="menudesplegado"]:checked {
    display: none;
}

.menu nav label {
    cursor: pointer;
    padding: .5em;
    position: relative;
    z-index: 9999;
}

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

  /* qué "botón" se oculta */
#menu-toggle:checked + #llamamenu,
#menu-toggle:not(:checked) + #llamamenu + #ocultamenu {
    display: none;
}

.menu nav ul {
    position: fixed;
    left: 100%;
    top: 0;
    height: 100vh;
    width: 50%;
    z-index: 9990;
    padding-top: 5em;
    transition: all .5s ease;
    background-color:#339FDA;
    color: white;
    top:-1em;
}

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

.cerrarsesion{
    font-size: 0.8em;
}

/*BARRA*/
.barra ul {
    display: flex;
    position: fixed;
    bottom: -16;
    right: 0;
    left: 0;
    width: 100%;
    z-index: 9999;
}

.barraabajo{
    max-width: 20%;
    padding-top: 1em;
    padding-bottom:0.5em;
    margin-right:5em;
    margin-left: auto;
}

.barradeabajo {
    list-style: none;
    background-color: #23BCEF;
    font-family: 'Poppins', sans-serif;
}

.titulonav{
    font-family: 'Poppins', sans-serif;
    font-size: 1em;
    margin: auto;
    margin-top: 0.5em;
    text-align: center;
    justify-content: center;
    display: flex;
    align-items: center;
    margin-bottom: 0.5em;
}

.material-icons.blue{
    color:#23BCEF;
}


/*PANTALL4-INICIAR SESION*/

.headeriniciar{
    display: flex;
    flex-direction: column;
    align-items: center;
}

img.iniciarlogo{
    width: 50%;
    margin-top: 2em;
}

.maininiciar{
    min-width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-top: 3em;
}

.sectioniniciar{
    background-color: white;
    border-radius: 2em;
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 85vw;
    max-width: 500px;
    padding: 2em;
    box-sizing:border-box;
}

.iniciarform{
    width: 100%;
}

.iniciarinput{
    display: block;
    padding: 1em;
    width: 100%;
    height: 3.5em;
    margin-bottom: 1em;
    font-family: 'Rubik', sans-serif;
    font-size: .8em;
    border-radius: 20px;
    background-color: #eeeeee;
    /* color: #514c4c;*/
    border: 0;
}

.botoniniciar{
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-top: 0.5em;
    margin-bottom: 0.5em;
    margin-left: auto;
    margin-right: auto;
    width: 60%;
    height: 3.5em;
    padding: 1em;
    border-radius: 20em;
    background-color: #23BCEF;
    color: white;
    font-family: 'Rubik', sans-serif; 
    font-size: 1em;
    font-weight: 700;
    border: none;
}

.botoniniciar:hover{
     background: #1385C8;
     color:white;
}

.contrasena{
    width: 100%;
    display: flex;
    flex-direction:column;
    align-items: center;
}

.olvidecontrasena{
   font-family: 'Rubik', sans-serif;
    font-size: 0.8em;
    margin-top: 0.5em;
    font-weight: 700;
    color: black;
}

.cuenta{
    display: flex;
    flex-direction: column;
    align-items: center;
    font-family: 'Rubik', sans-serif;
}

.cuenta p{
    font-size: 0.8em;
    margin-bottom: 0.1em;
    margin-top: 3em;
}

.cuenta a{
    text-decoration: none;
    color: black;
    font-size: 1em;
    font-weight: 700;
   
}



/*PANTALLA5-SUMATE-REGISTRATE*/

.radio{
    display: flex;
    flex-wrap: wrap;
    font-size: 0.8em;
    font-family: 'Rubik', sans-serif;
    margin-top: 1em;
}

.radio .estudiante{
    margin-top:0em ;
}

.botonseguir{
    display: flex;
    margin-top: 2em;
    margin-left: auto;
    margin-right: auto;
    height: 3em;
    border-radius: 1em;
    background-color: gainsboro;
    color: black;
    font-family: 'Rubik', sans-serif; 
    font-size: 0.9em;
    display: flex;
    justify-content: center;
    align-items: center;
}

.botonseguir:hover{
    background: #1385C8;
    color:white;
}

.queestasbuscando{
    margin-top: 2em;
    margin-bottom: -1em;
    font-family: 'Rubik', sans-serif;
    color:white;
    font-weight: 900;
    margin-top: 2em;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    font-size: 0.9em;
}



/*PANTALLA6-SUMATE-REGISTRATE*/

.destacado{
    font-family: 'Rubik', sans-serif;
    color:white;
    margin-top: 2em;
    margin-bottom: -1em;
    font-weight: 900;
    display: flex;
    text-align: center;
    flex-direction: column;
    font-size: 0.9em;
    
}

.sectionsumate{
     background-color: white;
     border-radius: 2em;
     display: flex;
     flex-direction: column;
     align-items: center;
     width: 90vw;
     padding: 2em;
     box-sizing:border-box;
}

.sumateform{
    font-family: 'Rubik', sans-serif; 
    font-size:0.8em;
}

.botonlisto{
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-top: 3em;
    margin-left: auto;
    margin-right: auto;
    width: 50%;
    height: 3.5em;
    padding: 1em;
    border-radius: 20px;
    background-color: #23BCEF;
    color: white;
    font-family: 'Rubik', sans-serif; 
    font-size: 0.8em;
    font-weight: 800;
    border: none;
}

.botonlisto:hover{
    background: #1385C8;
    color:white;
}

.titulocategoria{
    margin-left: 0.2em;
    }


/*PANTALLA7-RESULTADO*/

.pantalla7{
    background:#ffff;
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    border: 0;
    margin-top: 5em;
}

.nombreapellido{
    font-family: 'Poppins', sans-serif;
    font-size: 0.8em;
    text-align: center;
    margin-top: .3em;
}




/*PANTALLA8-PERFIL*/
.pantalla8{ 
    font-family: 'Rubik', sans-serif;
    background-color: #339FDA;
    color: white;
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    border: 0;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    margin-bottom: 3em;
     }

.perfil1{
    text-align: none;
    background-color: white;
    color: #23BCEF;
    text-align: center;
}

.nombre{
    font-size: 1em;
}
    
#avatar {
    width:50%; 
    border-radius:8em;
    margin-top: 5em;
}

.redes {
    display: block;
    padding-bottom: 1em;
}


#Instagram {
    width:15%;
}

#Pinterest {
    width:12%;
}

#Behance {
    width:12%;
    
}

.tituloespecialidad{
    font-size: 0.9em;
    text-align: center; 
}


.buscar{
    display:flex;
    margin-right: 2em;
    margin-top: -1em;
 }

.icono1{
    width:100%;
}


.archivos {
    display: block;
    padding-bottom: 1em;
}



.titulofolder{
    font-family: 'Rubik', sans-serif;
    font-size: 0.9em;
    text-decoration: none;
    color: lightcyan;
}

.folder{
    width: 25%;
   
 }

.botonmensaje1{
    max-width:2em;
    padding: 1em;
}

.open-button {
    background: black;
    border: none;
    cursor: pointer;
    opacity: 0.8;
    position: fixed;
    bottom: 10%;
    right:20;
    width: 25%;
    border-radius:5em;
}

.chat-popup {
  display: none;
  position: fixed;
  bottom: 0;
  left: 5em;
}

textarea.mensaje1{
    font-family: 'Rubik', sans-serif;
    
}

.form-container {
  max-width: 100%;
  padding: 1em;
  background-color: black;
}

.form-container textarea {
    border: none;
    background: white;
    min-height: 10em;
    margin-top: 1em;
}

.form-container .btn {
    background-color: WHITE;
    color: grey;
    padding-top: 0.5em;
    padding-bottom: 0.5em;
    border: none;
    cursor: pointer;
    width: 50%;
    margin-bottom:1em;
    font-family: 'Poppins', sans-serif;
    border-radius: 5em;
    margin-left: 4em;
    margin-top: 1em;    
}

.form-container .cancelar {
    margin-bottom: 4em;
    background-color:RED;
    color: white;
}




/*PANTALLA9-MENSAJES*/

.pantalla9{
    background:white;
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    border: 0;
    margin-top: 6em;
    margin-bottom: 3em;
}

.ul-chats {
    list-style: none;
    padding: 0;
    background:#339FDA;
    min-height: 100%;
}

.lista-chats {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    padding: 0;
    margin: 0;
    list-style: none;
    border-bottom: 2px solid #EEEEEE;
    padding: 1em 0 1em 0;
}

.info-chat {
    display: flex;
    align-items: center;
}

.imagen-chats{
    width: 50px;
    border-radius: 100px;
    margin-right: 1em;
    display: block;
    margin-left: 1em;
}

.titulomensaje {
    font-family: 'Poppins', sans-serif;
    color:white;
    font-weight: 700;
    font-size: 1.1em;
    margin: 0;
}

.nolink{
    text-decoration: none;
    display: flex;
    align-items: center;
}

.puntito-blanco {
    height: 10px;
    width: 10px;
    padding: 0.2em;
    margin-left:10em;
}



/*PANTALLA10-MENSAJES*/

.pantalla10{
    background:black;
    margin: 0;
    margin-top: 5em;
}

.mensaje{
    display:flex;
    text-align: center;
}

.titulochat{
    margin: auto;
    margin-left: 1em;
    font-family: 'Rubik', sans-serif;
    font-size: 0.9em;
}

.chatfoto{
    width: 15%;
    height: 0%;
    border-radius: 50%;
    left:0;
    
}

.mensajesconx{
    margin-bottom: 10em;

}

.container1 {
  border: 2px solid #dedede;
  background-color: white;
  border-radius: 0.5em;
  padding-left: 0.5em;
  padding-bottom: 0.6em;
  margin: 10px 0;
  margin-right: 3em;
  margin-left: 0.5em;
  font-family: 'Rubik', sans-serif;
}

.second{
  background-color: #23BCEE;
    border: none;
    color:white;
    margin-left:3em;
    margin-right: 0.5em;
    border-radius: 0.5em;
    padding-right: 0.5em;
    padding-top: 0.1em;
    font-family: 'Rubik', sans-serif;
}

.container::after {
  content:no-close-quote;
  clear: both;
  display: table;
}

.time-left {
    float: right;
    color:white;
    margin-top: -0.5em;
}

.textomensaje{
    text-align: right;
}

.comentario {
    position:fixed;
    bottom: 0;
    width: 75%;
    margin: 1em;
    padding: 0.8em;
    border-radius: 30em;
    font-family: 'Poppins', sans-serif;
    border: 0.5px solid #EDEDED;
    background: white;
    text-align: start;
}

#mensajeboton {
    position: fixed;
    bottom: 0;
    right: 0;
    margin: 1em;
    padding: 0.8em;
    background-color: #1385C8;
    border-radius: 100%;
    border: none;
}

.material-icons.flechita{
    color: white;
}




/*PANTALLA11-GUARDADOS*/
.pantalla11{
    background:white;
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    border: 0;
    margin-top: 5em;
}



/*PANTALLA12*/
.pantalla12{
    background:white;
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    border: 0;
    margin-top: 5em;
}

.ul-conf{
    list-style: none;
    padding: 0;
    min-height: 100%;
}

.lista-conf{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    padding: 0;
    margin: 0;
    list-style: none;
    border-bottom: 2px solid #EEEEEE;
    padding: 1em 0 1em 0;
}

.info-conf{
    display: flex;
    align-items: center;
}

.material-icons.cuenta{
    width:5%;
    margin-right: 1em;
    margin-left: 1em;
    color: #3B4AE1;
    font-weight: 600;
    font-size: 2.5em;
}

.cuenta{
    font-family: 'Poppins', sans-serif;
    color:black;
    font-weight: 700;
    font-size: 1.2em;
    margin: 0;
}


/*PANTALLA13-SUBIRARCHIVOS*/

.pantalla13{
    background:white;
    box-sizing: border-box;
    margin-left: auto;
    margin-right: auto;
    padding: 0;
    border: 0;
    margin-top: 4em;
}

.tituloarchivo{
    margin-top: 0.5em;
    font-family: 'Rubik', sans-serif;
    font-size: 0.9em;
}

#diferente {
    width: 95%;
    background-color: #f8f8f8;
    border: 0.1em solid  #23BCEE;
    padding: 1em;
    margin-top: 1em;
    outline: none;
    text-align: left;
    font-size: 1em;
    border-radius: 0.5em;
    margin-left: 0.5em; 
}

.seleccionararchivo {
    margin-left: 1em;
    font-size: 0.8em;
    }

input {
    background-color: transparent;
    border: none;
    padding-bottom: 0.5em;
    margin-top: 1em;
    outline: none;
    text-align: center;
    font-size: 0.9em;
}

textarea{
    width: 95%;
    height: auto;
    padding: 1em;
    border: 0.1em solid  #23BCEE;
    border-radius: 0.5em;
    background-color: #f8f8f8;
    font-size: 1em;
    resize: none;
    margin-left: 0.5em;
    margin-top: 2em;
    margin-bottom: 1em;
}

.disciplina{
    margin-left: 1em;
    font-family: 'Rubik', sans-serif;
    
    }

.botonhecho{
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-top: 3em;
    margin-left: auto;
    margin-right: auto;
    width: 40%;
    padding: 1em;
    border-radius: 20em;
    background-color: #23BCEF;
    color: white;
    font-family: 'Rubik', sans-serif; 
    font-size: 0.8em;
    font-weight: 800;
    border: none;
}

.descripcion{
    font-family: 'Rubik', sans-serif; 
}


/*PANTALLA14*/
.pantalla14{
    background: white;
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    border: 0;
    margin-top: 10em;
}

.archivoexito{
    text-align: center;
}

.material-icons.archivo{
    width:0%;
    color: #3B4AE1;
    font-weight: 600;
    font-size: 5em;
    margin-right: 1em;
}

.textoarchivo{
    font-family: 'Rubik', sans-serif;
    font-size: 1.2em;
}

.botonesexito{
    text-align: center;
    margin-top: 5em;
    justify-content: space-between;
}

.subirotro{
    font-family: 'Poppins', sans-serif;
    border-radius: 5em;
    font-size: 0.9em;
    background:#3B4AE1;
    color:white;
    padding: 0.8em;
    border: none;
}

.subirotro1{
    font-family: 'Poppins', sans-serif;
    border-radius: 5em;
    font-size: 0.9em;
    background:#23BCEF;
    color:white;
    padding: 0.8em;
    border: none;
    margin-top: -5em;
}

/*PANTALLA15*/
.pantalla15{
    background:white;
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    border: 0;
    margin-top: 1.8em;
}

.textos {
    padding: 1em;
    font-family: 'Rubik', sans-serif;
    font-size: 0.9em;
    margin-top: 4em;
}

h3 {
    display: flex;
    align-items: center;
    font-family: 'Poppins', sans-serif;
    font-size: 1.2em;
}

.videoresponsive{
    position:relative;
    padding-bottom: 56.27%;
    padding-top: 25px;
    overflow: hidden;
     
}

iframe{
    position: absolute;
    top:0;
    left: 0;
    width: 100%;
    height: 100%;
}


/*PANTALLA16*/
.resultado16{
    color: white;
    text-align: center;
    margin-top: 2em;
    font-family: 'Rubik', sans-serif;
    font-size: 0.9em;
}




/*MEDIAQUERIES*/

@media (max-width: 40em){
    
/*PANTALLA1*/
.logobuscainiciasumate{
         width:30%;
    }
    
.headerinicio, .sectioninicio{
         flex-direction:column;
    }
    
.logobuscainiciasumate{
        width: 60%;
        margin-top: -5em;
    }
    
/*PANTALLA2*/
.queestasbuscando{
    font-size: 1em;
    }
 
.galeria figure{
    width: 30%;
    margin-left: 0.2em;
    margin-right: 0.3em;
    margin-top: -4.1;
}

.galeria figcaption{
    font-size: 0.7em;
    margin-top: 0.2em;
}
    
    

/*PANTALLA3*/
    .cerrarsesion{
        margin-top: 2em;
    }
    
   
    
/*PANTALLA5*/
.botonseguir{
        width:58%;
    }

}

 
@media (min-width: 50em){
    
    #menu-toggle,
    #menu-toggle:checked + #llamamenu,
    #menu-toggle:not(:checked) + #llamamenu,
    #menu-toggle:checked + #llamamenu + #ocultamenu,
    #menu-toggle:not(checked) + #llamamenu + #ocultamenu {
        display: none;
    }
    
    
    #menu-toggle:not(:checked) + #llamamenu + #ocultamenu + ul,
    #menu-toggle:checked + #llamamenu + #ocultamenu + ul {
        display: flex;
        flex-wrap: wrap;
        background: none;
        position: relative;
        top: auto;
        left: auto;
        height: auto;
        width: 100%;
        padding-top: 0;
    } 
    
    /*PANTALLA3*/
    
.menu{
    padding:.70em;
}
    

/*PANTALLAINDEX*/
    
.logocarga{
    margin-top: 15%;
    margin-right: 35em;
}

.logoindex{
    width: 400px;
}
    
      
/*PANTALLA1*/
.logobuscainiciasumate{
    width:40%;
}
  
    
/*PANTALLA2*/    
.galeria figure{
    width: 10%;
    margin-left: 5em;
    margin-right: 5em;
    margin-top: 2em;
}
    

    
/*PANTALLA3*/
.menu nav a {
        padding-left: 2em;
    }
    
.barra ul {
    width: 30%;
    margin-left:auto;
    margin-right: auto;
    border-radius: 0%;
}

.barraabajo{
    max-width: 20%;
    padding-top: 1em;
    margin-left: 1em; 
}

    
/*PANTALLA5*/
.iniciarlogo{
        max-width: 25%;
    }
    
    
    /*PANTALLA8*/
#avatar {
    margin-top: 10em;
} 
    
.icono1{
    width:50%;
    margin-left: 15%;
}
    
    .chat-popup {
  left: 70%;
}
    
textarea.mensaje1{
        width: 100%;
    margin-right: auto;
    margin-left: auto;
    }

.open-button {
    width: 10%;
}

.form-container {
  max-width: 100%;
}

       
    /*PANTALLA9*/
    
.chat{
    display: flex;
    align-content: center;
    justify-content: center;
    }
    
    
.ul-chats {
    min-height: 100vh;
    min-width: 100vh;
}

.puntito-blanco {
    margin-left:23em;
}

    /*PANTALLA10-MENSAJES*/

.pantalla10{
    margin-top: 10em;
}

.mensaje{
    margin-right: 12em;
}

.chatfoto{
    width: 5%; 
}

.container1 {
  margin-right: 30em;
}

.second{
    margin-left:30em;
}

.comentario {
    width: 90%;
}

    
    
/*PANTALLA13-SUBIRARCHIVOS*/

.pantalla13{
    margin-top: 8em;
}
    
#diferente {
    width: 50%;
    margin-left: 10em; 
}

textarea{
    width: 50%;
    margin-left: 10em;
    margin-top: 3em;
    padding: 1em;
}

.botonhecho{
    width: 10%; 
}
    
        /*PANTALLA15*/
.textos {
    padding: 2em;
   
}

h3 {
   margin-top: 2em;
}

}


@media (min-width: 75em){
    
    
/*PANTALLAindex*/
    
.logocarga{
    margin-top: 15%;
    margin-right: 42em;
}

.logoindex{
    width: 400px;
}
    
  /*PANTALLA01*/
    main.principales {
	margin-top: 3em;
}
    
/*PANTALLA1*/
    
.logobuscainiciasumate{
    width:30%;
}
    
    
/*PANTALLA2*/
    
.estasbuscando{
    font-size: 1.5em;
}    
    
.galeria figure{
    width: 10%;
    margin-left: 5em;
    margin-right: 5em;
    margin-top: 2em;
}

.entra, .sumate1{
    font-size:1em;
    border-radius:5em;
    width:20%;
    padding:1em;
    top: 85%;
}

.entra{
    margin-left: 20%;
    
}

.sumate1{
    margin-right:20% ;
}
    


    
/*PANTALLA3*/
    
.menu{
    padding:.70em;
}
   
.pantalla3{
    margin-top: 8em;
}
    
.menu nav a {
        padding-left: 2em;
    }
    
.barra ul {
    width: 30%;
    margin-left:auto;
    margin-right: auto;
    border-radius: 0%;
}

.barraabajo{
    max-width: 20%;
    padding-top: 1em;
    margin-left: 2em;
}
    
    
/*PANTALLA5*/

    
.queestasbuscando{
    margin-top: 2em;
    margin-bottom: 1em;
    font-size: 1.5em;
}
    
    
        
/*PANTALLA6*/
    
.destacado{
        font-size: 1.5em;
    }
    
.botonlisto{
    width:100%;
    font-size: 1em;
    font-weight: 900;
}
    
.sectionsumate{
        width: 30vw;
    }
   
.pantalla6{
        margin-right: 5em;
    }
    
.menucerrar{
        width: 50%;
    }
    
    
    /*PANTALLA8*/
    
#avatar {
    margin-top: 10em;
} 

.icono1{
    width:50%;
    margin-left: 15%;
}

.chat-popup {
  left: 70%;
}
    
textarea.mensaje1{
        width: 100%;
    margin-right: auto;
    margin-left: auto;
    }

.open-button {
    width: 5%;
}

.form-container {
  max-width: 50%;
  padding: 2em;
  background-color: black;
  margin-right: 30%;
  
}
   
    /*PANTALLA9*/
    
.chat{
    display: flex;
    align-content: center;
    justify-content: center;
    }
    
    
.ul-chats {
    min-height: 100vh;
    min-width: 100vh;
}

.puntito-blanco {
    margin-left:23em;
}



/*PANTALLA10-MENSAJES*/

.pantalla10{
    margin-top: 8em;
}

.mensaje{
    margin-right: 12em;
}

.chatfoto{
    width: 5%; 
}

.mensajesconx{
    margin-bottom: 10em;

}

.container1 {
  margin-right: 50em;
}

.second{
    margin-left:50em;
}

.comentario {
    width: 93%;
}

/*PANTALLA13-SUBIRARCHIVOS*/

.pantalla13{
    margin-top: 8em;
}
    
#diferente {
    width: 50%;
    margin-left: 10em; 
}

textarea{
    width: 50%;
    margin-left: 10em;
    margin-top: 3em;
    padding: 1em;
}

.botonhecho{
    width: 10%; 
}
   
    /*PANTALLA15*/
.textos {
    padding: 2em;
   
}

h3 {
   margin-top: 2em;
}


    
}