@charset "utf-8";

@import url('https://fonts.googleapis.com/css2?family=Ubuntu:wght@500;700&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap');

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  font-family: "Roboto", sans-serif;
}

/*---logoaumarindex-----*/

#logoacumar {
  width: 100%;  
  background-color: #298cee;
}

#acumar {
    display: block;
    width: 50%;
    max-width: 25em;
    margin-left: auto;
    margin-right: auto;
    margin-top: 25%;
    margin-bottom: 25%; 
}


/*----- editar por orden de pantallas----*/

/*--------------MENU---------------------*/

header nav {
  color: white;
}

header nav a {
  color: rgba(255, 255, 255, 0.75);
  padding: .5em 1em;
  text-decoration: none;
  display: flex;
  justify-content: center;
  align-items: center;
}

header nav a:hover {
  background-color: rgba(0, 0, 0, 0.5);
  color: white;
}

header nav ul {
  list-style: none;
  background-color: rgba(0, 0, 0, 0.5);
  /* el menu sale del flujo de informaciones
  y se oculta a la derecha */
  position: fixed;
  left: 100%;
  top: 0;
  height: 100vh;
  width: 50vw;
  z-index: 9990;
  padding-top: 5em;
  transition: all .5s ease;
  background-color: rgb(0, 157, 255);
  border-radius: 30px;
}

.visible {
  /* el menú se muestra
  corriéndose a la izquierda */
  left: 50%;
  transition: all .25s ease;
}

.material-icon {
  font-family: 'Material Icons';
  font-weight: normal;
  font-style: normal;
  font-size: 24px;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: 'liga';
  -webkit-font-smoothing: antialiased;
}

#llamamenu i {
  padding: 0;
  margin: auto;
}

#llamamenu {
  background: none;
  color: rgb(255, 255, 255);
  cursor: pointer;
  height: 3em;
  width: 3em;
  border: none;
  /* caja flexible */
  display: flex;
  position: relative;
  z-index: 9999;
}





/*<----------PERFIL---------->*/

figure img {
  max-width: 100%;
  height: auto;
  overflow: hidden;
  border-radius: 50%;
  border-style: solid;
  border-width: 8px;
  border-color: #cde3f5;



}

form {
  width: 100%;
  max-width: 21em;
  margin: auto;
}

.infouser {
  width: 100%;
  display: flex;
  flex-direction: column;
}

.name {
  font-size: 1.5em;
  font-family: 'Roboto', sans-serif;
  font-weight: 400;
  padding: 0.2em 0.5em;
  text-align: center;
  border: 1px solid rgb(153, 153, 153);
  border-radius: 100px;
  margin-bottom: 0.5em;
}


.edadtel {
  width: 100%;
  display: flex;
  justify-content: space-between;
}

.edadtel input.edad {
  width: 30%;
  font-size: 1em;
  font-family: 'Roboto', sans-serif;
  font-weight: 400;
  text-align: center;
  padding: 0.5em 0;
  border: 1px solid rgb(153, 153, 153);
  border-radius: 100px;
  margin-bottom: 0.5em;
}

input.tel {
  width: 65%;
  font-size: 1em;
  font-family: 'Roboto', sans-serif;
  font-weight: 400;
  text-align: center;
  padding: 0.5em 0;
  border: 1px solid rgb(153, 153, 153);
  border-radius: 100px;
  margin-bottom: 0.5em;
}

.usertype {
  display: flex;
}

#usertype {
  text-align: center;
  border-radius: 20px;
  border: 1px solid rgb(153, 153, 153);
  padding: 0.3em 2.5em 0.3em 4em;
  font-size: 1.1em;
  font-family: 'Roboto', sans-serif;
  font-weight: 400;
  width: 100%;
  text-align: center;
  margin-top: 0.2em;
  margin-bottom: 0.5em
}

#usertype option {
  font-size: 0.7em;

}

.usertype ul {
  padding: 1.5px;
}

#portada .avatar {
  width: 150px;
  margin-top: 20vh;
}

#portada {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 30vh;
  background-image: url(imagenes/img5b.jpg);
  background-size: cover;

}

.galeria ul li img {
  width: 100%;
  height: auto;
}

.galeria ul li iframe {
  width: 100%;
height: 200px;
}
/*<----------------END OF PERFIL------------->*/

.tituloperfil h1 {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0) 70%, rgb(236, 247, 255) 70%);
  font-size: 2em;
  font-family: 'Ubuntu', sans-serif;
  font-weight: 700;
}

.tituloperfil {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  margin-top: 3.8em;
  margin-bottom: -1em;
}

/*<----------------titulos------------->*/








/*<----------------LOGIN--------------------->*/


#bodylogin {
  font-family: 'Roboto', sans-serif;
  background-image: url(../imagenes/fondo-01.jpg);
  background-size: cover;
}


#logopuente {
  max-width: 60%;
  max-height: 60%;
  padding-bottom: 10px;
}

#logopuente2 {
  display: none;
}

.login {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}


.login ul {
  list-style-type: none;
}

.iniciarsesion,
.botonredes,
input[type=email],
input[type=password] {
  width: 100%;
  font-family: 'Roboto', sans-serif;
}

input[type=email],
input[type=password] {
  padding: 12px;
  border: 1px solid rgba(0, 0, 0, .30);
  border-radius: 100px;
  margin: 8px;
  font-style: italic;
  font-size: 1em;
  padding-left: 10%;
}

.iniciarsesion {
  padding: 12px;
  color: white;
  background-color: #298cee;
  border: 1px solid #298cee;
  border-radius: 100px;
  margin: 5px 8px 0 8px;
  font-size: 1.2em;
}

.botonredes {
  padding-top: 0.7em;
  padding-bottom: 0.7em;
  margin: 10px 8px 0 8px;
  border: 1px solid rgba(0, 0, 0, .20);
  border-radius: 100px;
  font-size: 0.9em;
  color: rgba(0, 0, 0, .40);
  background: none;
  display: flex;
  align-items: center;
  justify-content: flex-start;
}

.fa-facebook-square,
.fa-google,
.fa-user {
  font-size: 23px;
  margin: 0 0.5em 0 0.8em;
  opacity: 0.8;
}

.fa-facebook-square {
  color: #3b5998;
  display: flex;
}

.fa-google {
  color: #FF5733;
}

.fa-user {
  color: dimgrey;
}

.registro {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  margin-top: 10px;
}

.registro p {
  margin-bottom: 0.3em;
  margin-top: 0.3em;
  margin-left: 0;
}

.registro a {
  text-decoration: none;
  color: #298cee;
  font-size: 0.9em;
}



/*<-------------end of login----------->*/



#logo {
  width: 12em;
  max-width: 12em;
  margin-left: 0.3em;
  margin-right: 0.3em;
}

#menu {
  width: 2em;
  max-width: 2em;
  margin-right: 1em;
}

body {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  min-height: -webkit-fill-available;
  justify-content: space-between;
}

main {
  display: flex;
  flex-direction: column;
  justify-content: center;
  margin-top: 3em;
  margin-bottom: 3em;
  margin-left: 1.5em;
  margin-right: 1.5em;
  flex-grow: 1;
}



#pastillas {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-self: center;
  width: 100%;
  margin-left: 0%;
  margin-right: 0%;
}


#pastillas {
  width: 100%;
  flex-direction: column;
  justify-content: center;
  align-self: center;
}

.correcion li {
  list-style-type: none;
}

#pastillas li img {
  align-self: center;
  z-index: -1;
  width: 100%;
  height: 8em;
  border-radius: 2em;
}

.correcion {
  flex-direction: column;
  justify-content: center;
  margin: 0 auto;
  width: 100%;
  list-style-type: none;
  color: white;
}



.correcion p {
  margin-left: 30px;


}

.correcion li h2 {

  color: rgb(255, 255, 255);
  margin-top: -5em;
  margin-left: 30px;

}

.correcion li h4 {
  color: rgb(255, 255, 255);
  font-weight: 200;
  margin-left: 30px;


}

.correcion li div {
  padding-top: 10px;
  margin-right: 10px
}

.novedades {
  text-align: center;
  font-size: 2vh;
  padding-bottom: 20px;
  color: #177bd8;

}

.highlight {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0) 70%, #FFD0AE 70%);
  display: inline-block;
}

.boton {
  margin: auto;
  max-width: 30vh;
  margin-left: em;
}


#boton3 {
  margin: auto;
  max-width: 30vh;
  margin-bottom: 2em;
}



.form {
  display: flex;
  margin-top: 3em;
  margin-bottom: 3em;
  text-align: center;
  justify-content: center;
  color: #177bd8;
}

.selector {
  display: flex;
  flex-direction: row;
  text-align: center;
  align-items: center;
  margin: 0 0 0 0;
}

.selector h3 {
  margin-left: 1em;
  margin-right: 2em;
  color: #177bd8;
}

.switch {
  position: absolute;
  width: 60px;
  height: 34px;
  margin-top: -20px;

}

.switch input {
  opacity: 0;
  width: 0;
  height: 0;
}

.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: .4s;
  transition: .4s;
}

.slider:before {
  position: absolute;
  content: "";
  height: 26px;
  width: 26px;
  left: 4px;
  bottom: 4px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
}

input:checked+.slider {
  background-color: #2196F3;
}

input:focus+.slider {
  box-shadow: 0 0 1px #2196F3;
}

input:checked+.slider:before {
  -webkit-transform: translateX(26px);
  -ms-transform: translateX(26px);
  transform: translateX(26px);
}

.slider.round {
  border-radius: 34px;
}

.slider.round:before {
  border-radius: 50%;
}

input[type="number"] {
  width: 20vh;
}

input+span {
  padding: 2px;
}

input:invalid+span:after {
  position: absolute;
  content: '✖';
  padding-left: 5px;
}



.pimg {
  position: relative;
  left: 16em;
  top: 8em;
  height: 50px;
  width: 50px;
}

.pastilla {
  position: relative;
  top: 8em;
  color: #fff;
}


img {
  max-width: 100%;
  height: auto;

}

/*----------------FOOTER------------------------*/

footer nav ul {
  list-style-type: none;
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  background-color: #fff;
  padding: 7px;
  box-shadow: 0 0 0.3em rgba(0, 0, 0, 0.5);
}

footer nav ul li {
  width: 3em;
  height: 3em;
}


/*------------CALENDARIO---------------------*/


main article {
  display: block;

}

main article ul {
  list-style-type: none;
}

.mes {
  display: flex;
  flex-direction: column;
  padding: 20px 20px;
  background: #218be2;
  text-align: center;
  margin-top: 10vh;
    margin: auto;
  width: 20.5em
}

.mes ul {
  margin: 0;
  padding: 0;

}

.mes ul li {
  color: white;
  font-size: 20px;
  text-transform: uppercase;
  letter-spacing: 3px;

}

.mes .ant {
  float: left;
  padding-top: 10px;
}


.mes .sig {
  float: right;
  padding-top: 10px;
}


.semana {
  padding: 5px 0;
  background-color: #ddd;
  width: 20.5em;
    margin: auto;

}


.semana li {
  display: inline-block;
  width: 13%;
  color: #666;
  text-align: center;
}


.dias {
  padding: 5px 0;
  background: #eee;
  width: 20.5em;
    margin: auto;

}


.dias li {
  list-style-type: none;
  display: inline-block;
  width: 2.8em;
  height: 3em;
  text-align: center;
  font-size: 15px;
  color: #777;
}

.seleccionado {
  padding: 10px;
  border-radius: 100%;
  background: #177bd8;
  color: white !important
}

.calen {
  margin-top: -3em;
}


/*---------- Turno ----------*/



.turnoconfi h1 {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0) 70%, rgb(236, 247, 255) 70%);
  font-size: 2em;
  font-family: 'Ubuntu', sans-serif;
  font-weight: 700;
}

.turnoconfi {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  margin-top: 4em;
  margin-bottom: 1em;
}

.turnoconfi h1 {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0) 70%, #DCEEF9 70%);
}



#descarga h2 {
  font-size: 2em;
}

main #descarga img {
  width: 1.5em;
  max-width: 1.5em;
  margin-left: 1em;
}

main #descarga {
  display: flex;

}

main .fechayhora h5 {
  text-align: center;
  font-size: 1.2em;
  margin: 0.8em;
}





main #descarga {
  display: flex;
  justify-content: center;
}

main .qr img {
  display: flex;
  margin-left: auto;
  margin-right: auto;
  width: 60%;

  max-width: 15em;
  margin-top: 2em;
  margin-bottom: 1em;
}

.codigos div p {
  text-align: center;
  font-size: 1em;
  margin-top: 2em;
  margin-bottom: 1em;
  font-family: 'Roboto', sans-serif;
  font-weight: 400;
}

.cancelar h3 {
  font-size: 1.2em;
  text-align: center;
  margin: 1em 1.5em;
  padding: 0.5em;
  background-color: #E1A3A1;
  border-radius: 2em;
  font-family: 'Roboto', sans-serif;
  font-weight: 500;

}

.cancelar .encurso {
  background-color: #298CEE;
  margin: 1em 1.5em;
  padding: 0.5em;
  color: #FFFFFF;
  font-family: 'Roboto', sans-serif;
  font-weight: 400;

}

a:link {
  text-decoration: none;
}

a {
  color: black;
}

.historial h2 {
  font-size: 2em;
  color: #989898;
  font-family: 'Roboto', sans-serif;
}

.historial img {
  width: 2em;
  min-width: 2em;
  margin-right: 1em;
}

.reloj {
  display: flex;
  justify-content: center;
  margin-top: 1em;
}

.historial div ul p {
  text-align: center;
  padding: 0.5em;
  font-family: 'Roboto', sans-serif;
}

.historial div ul {
  margin-top: 1em;
  margin-bottom: 2em;
}

/*-------------turno agendado------*/
.turnoagendado {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.turnoagendado h1 {
  text-align: center;
  font-size: 2em;
  margin-top: em;
  margin-left: 1em;
  margin-right: 1em;
  margin-bottom: 30px;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0) 70%, #DCEEF9 70%);
  font-family: 'Ubuntu', sans-serif;
  font-weight: 700;
}


/*----------turno cancelado-----------*/


.turnocancelado {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.turnocancelado h1 {
  text-align: center;
  font-size: 2em;
  margin-top: -3.2em;
  margin-left: 1.5em;
  margin-right: 1.5em;
  margin-bottom: 30px;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0) 80%, #E1A3A1 80%);
  font-family: 'Ubuntu', sans-serif;
  font-weight: 700;

}


.penalidad p {
  color: #E1A3A1;
  text-align: center;
  margin-top: 2em;
  margin-bottom: 2em;
  margin-left: 2em;
  margin-right: 2em;

}

.botones .turnosagendados {
  width: 15em;
  font-size: 1.2em;
  text-align: center;
  margin: 1em auto;
  padding: 0.5em;
  background-color: #298CEE;
  border-radius: 2em;
  color: #ffffff;
  font-family: 'Roboto', sans-serif;
}


.botones .reservarturno {
  width: 15em;
  font-size: 1.2em;
  text-align: center;
  margin: 1em auto;
  padding: 0.5em;
  background-color: #298CEE;
  border-radius: 2em;
  color: #ffffff;
  font-family: 'Roboto', sans-serif;
  font-weight: 400;
}




/*---------------------notificaciones-------------*/

div.notificaciones {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  margin-top: 7em;
}

div.notificaciones h1 {
  text-align: center;
  font-size: 2em;
  margin-top: -4.0em;
  margin-bottom: 0;
  margin-left: 1.5em;
  margin-right: 1.5em;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0) 70%, #DCEEF9 70%);
  font-family: 'Ubuntu', sans-serif;
  font-weight: 700;
}


div.notificaciones1 {
  margin: 10px auto 0 auto;
  width: 75%;
  background-color: rgb(255, 255, 255);

}

div.notificaciones1 img {
  width: 3em;
  min-width: 2em;
  display: flex;
  position: relative;
  top: 45px;
  left: -50px;
  margin-top: -60px;
}



div.notificaciones1 h3 {

  text-align: left;
  color: #000000;
}

div.notificaciones1 p {

  text-align: left;
  color: #000000;
  margin-left: auto;
}

div.notificaciones1 h6 {

  text-align: right;
  color: gray;
  font-size: 0.7em;
}

div.linea {
  height: 1px;
  background-color: gray;
  margin-top: 02em;
}



/*-----------------Turnos Agendados-------------*/


a.link {
  text-decoration: none;
}

a {
  text-decoration: none;
}

div.turnosagendados1 {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;

}

div.turnosagendados1 h1 {
  text-align: center;
  font-size: 2em;
  margin-top: 1.1em;
  margin-bottom: 1em;
  margin-left: 0.5em;
  margin-right: 0.5em;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0) 70%, #DCEEF9 70%);
  font-family: 'Ubuntu', sans-serif;
  font-weight: 700;

}

div.turno1 {
  margin: 10px auto 0 auto;
  width: 18em;
  background-color: rgb(255, 255, 255);
  border: 1px solid #298cee;
  border-radius: 100px;

}

div.turno1 h3 {
  margin: 3%;
  text-align: center;
  color: #000000;
}



div.turnosmax {
  margin: 15px auto 0 auto;
  width: 75%;
}

div.turnosmax h4 {
  margin-top: 2em;
  margin-bottom: 2em;
  text-align: center;
  color: #298cee;
  font-size: 0.8em;
}




/*<----------RESPONSIVE------>*/



/*Dispositivos desde 600px de ancho*/
@media screen and (min-width: 600px) {


  #acumar {
    position: fixed;
    top: 10%;
    left: 25%;
    right: 25%;
  }
}

html {
  height: -webkit-fill-available;
}

header .contenedor {
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  align-items: center;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  background-color: rgb(5, 155, 255);
  padding: 7px;
  box-shadow: 0 0 0.3em rgba(0, 0, 0, 0.5);
}

.cancelar h3 {
  width: 60%;
  max-width: 60%;
  margin: 1em 20%;

}

.cancelar .encurso {
  width: 60%;
  margin: 1em 20%;
}


/*----------perfil----*/

.edad2 input {
  margin-top: 1em;
  margin-bottom: 0.5em;
  border-radius: 50px;
  border: 1px solid rgb(153, 153, 153);
  padding: 0.3em;
  font-size: 1.2em;
  text-align: center;
  width: 49%;
}

.edad2 {
  width: 50%;
  max-width: 17em;
  max-height: 17em;
  font-family: 'Roboto', sans-serif;
}

/*Dispositivos desde 768px de ancho*/
@media screen and (min-width: 768px) {



  #bodylogin {
    background-image: url(../imagenes/fondo-02.jpg);
  }


  #logopuente {
    display: block;
    max-width: 35%;
    max-height: 35%;
  }
   

  input[type=email],
  input[type=password] {
    font-size: 1.3em;
  }

  .iniciarsesion {
    font-size: 1.5em;
  }

  .botonredes {
    font-size: 1.2em;
  }

  .registro a {
    font-size: 1.2em;
  }




  header .contenedor {
    display: flex;
    flex-direction: row;
    justify-content: space-around;
  }




  .correion img {
    display: block;
    max-width: 35em;
    max-height: auto;
  }

  .novedades h2 {
    margin-left: 2.em;
    margin-bottom: 1em;
  }


  .cancelar h3 {
    width: 60%;
    margin: 1em 20%;

  }

  .cancelar .encurso {
    width: 60%;
    margin: 1em 20%;
  }

  .turnocancelado h1 {


    margin-left: 5em;
    margin-right: 5em;
  }


  .botones .turnosagendados {
    margin: 1em 20%;
  }

  .botones .reservarturno {
    margin: 1em 20%;
  }



  /*-----perfil---*/

 

  .edad2 input {
    margin-top: 1em;
    margin-bottom: 0.5em;
    border-radius: 50px;
    border: 1px solid rgb(153, 153, 153);
    padding: 0.3em;
    font-size: 1.2em;
    text-align: center;
    width: 49%;
  }

  .edad2 {
    width: 40%;
    max-width: 17em;
    max-height: 17em;
    font-family: 'Roboto', sans-serif;
  }

  .galeria ul li iframe {
    width: 100%;
    height: 400px;
  }
    


/*Dispositivos desde 992px de ancho*/
@media screen and (min-width: 992px) {

    
    
  .codibotohisto {

    position: relative;
    column-count: 2;
    margin-top: 2em;
    margin-left: 3em;
    margin-right: 3em;
    margin-bottom: 3em;
  }


  .selector {
    display: flex;
    flex-direction: row;
    text-align: center;
    align-items: center;
    margin: 0 0 0 0;
  }

  .selector h3 {
    margin-left: 1em;
    color: #177bd8;
  }

    }
  .switch {
    position: absolute;
    width: 60px;
    height: 34px;
    margin-top: -20px;
    margin-left: -30px;
  }

    
    
  /*----reservas-*/

  .tituloperfil h1 {
    margin-top: -150px;
  }
    
    .tituloperfil .linea2{
        margin-top: -10px;
    }
  .codibotohisto1 #boton3 {
    margin-left: 120px
  }

  .codibotohisto1 .selector h3 {
    margin-left: -200px;
  }

  .codibotohisto1 .selector {
    margin-left: -50px;
  }

  .codibotohisto1 .form {

    padding-top: 30px;
    margin-left: 90px;
    display: flex;
  }

  .codibotohisto1 {

    position: relative;
    column-count: 2;
    margin-top: 2em;
    margin-left: 8em;
    margin-right: 8em;
    margin-bottom: 3em;
  }

  .codibotohisto3 {

    column-count: 2;
    margin-top: 2em;
    margin-left: 7em;
    margin-right: 7em;
    margin-bottom: 3em;
  }

  .boton {
    align-content: center;
  }

  .novedades {
    padding-top: 70px;
  }
    
    
    
    
  .botones .turnosagendados {
    margin: 1em auto;
  }

  .botones .reservarturno {
    margin: 1em auto;
  }

  /*-----menu------*/



  #llamamenu {
    display: none;
  }


  header nav ul {
    display: flex;
    flex-wrap: nowrap;
    flex-direction: row;
    align-items: center;
    position: relative;
    top: auto;
    left: auto;
    right: 20vw;
    height: auto;
    width: 100%;
    padding-top: 0;
  }

  header nav ul.visible {
    left: auto;
  }


  /*--------finmenu------*/

  /*Dispositivos desde 1200px de ancho*/
  @media screen and (min-width: 1200px) {

      /*-----menu------*/



  #llamamenu {
    display: none;
  }


  header nav ul {
    display: flex;
    flex-wrap: nowrap;
    flex-direction: row;
    align-items: center;
    position: relative;
    top: auto;
    left: auto;
    right: 10vw;
    height: auto;
    width: 100%;
    padding-top: 0;
    
  }


  header nav ul.visible {
    left: auto;
  }


  /*--------finmenu------*/

  /*----calendario------*/


    .codibotohisto3 {

      position: relative;
      column-count: 2;
      margin-top: 2em;
      margin-left: 12em;
      margin-right: 12em;
      margin-bottom: 3em;
    }

    .boton {
      margin: auto;
    }


    .novedades {
      padding-top: 70px;
    }

    /*---- notificaiones---*/


    .notificaciones {
      padding-top: 50px;
    }


    /*---reserva---*/

    .tituloperfil h1 {
    margin-top: -150px;
  }
    
    .tituloperfil .linea2{
        margin-top: -10px;}

    .codibotohisto1 #boton3 {
      margin-left: 120px
    }

    .codibotohisto1 .selector h3 {
      margin-left: -200px;
    }

    .codibotohisto1 .selector {
      margin-left: -50px;
    }

    .codibotohisto1 .form {

      padding-top: 30px;
      margin-left: 90px;
      display: flex;
    }

    .codibotohisto1 {

      position: relative;
      column-count: 2;
      margin-top: 2em;
      margin-left: 13em;
      margin-right: 13em;
      margin-bottom: 3em;
    }


    /*-----fin de reserva----*/

    .turnoagendado h1 {
      margin-top: 70px;
    }


    .turnocancelado1 .botones {
      width: 40%;
      margin: auto;
    }

    .turnocancelado {
      margin-top: 20px;
    }

    .turnosagendados1 {
      margin-top: -55px;
    }

    .codibotohisto {

      position: relative;
      column-count: 2;
      margin-top: 2em;
      margin-left: 15em;
      margin-right: 15em;
      margin-bottom: 3em;
    }

    .codigos .botohisto {
      display: flex;
      width: 100%;
    }

    .codigos {
      margin-left: 0%
    }

    main #descarga {
      display: flex;

    }

    main .fechayhora h5 {
      text-align: center;
      font-size: 1.2em;
      margin: 0.8em;
      width: 100%
    }





    main #descarga {
      display: flex;
      width: 100%;
      margin-left: 1em;
    }

    main .qr img {
      width: 100%;
    }

    main .qr {
      width: 100%;
    }

    .cancelar {
      margin-top: 3em;
      width: 100%;
    }


    .historial {
      width: 100%;
    }

    .codebotohisto {
      width: 100%;

    }



  }

  /*--------turnos agendados------*/




  /*-----perfil----*/
  #portada .avatar {
    width: 150px;
    margin-top: 20vh;
  }

  #portada {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100vw;
    height: 30vh;
    background-image: url("../imagenes/portadaperfil2.jpg");
    background-size: cover;
  }




#acumar {
    display: block;
    width: 50%;
    max-width: 20em;
    margin-left: auto;
    margin-right: auto;
    margin-top: 15%;
    margin-bottom: 25%; 
}

  #portada {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100vw;
    height: 30vh;
    background-image: url(../imagenes/img5b.jpg);
    background-size: cover;
  
  }

  .galeria ul li iframe {
    width: 100%;
    height:800px;
  }



  /*---------indelogin--------*/

  #bodylogin {
    background-image: url(../imagenes/fondo-03.jpg);
  }

  #logopuente {
    display: none;
  }

  #logopuente2 {
    display: block;
    width: 45%;
    margin-left: 7em;
  }

  .login {
    display: flex;
    flex-direction: row;
    justify-content: space-around;
  }
    

  .login ul {
    margin-right: 10em;
  }

  input[type=email],
  input[type=password] {
    font-size: 0.9em;
  }

  
    
.iniciarsesion {
    font-size: 1em;
  }    
    
  .iniciarsesion:hover {
   background-color: white;
    color: #298cee;      
  }
    

  .botonredes {
    font-size: 0.9em;
  }

  .botonredes:hover{
     background-color: #cde3f5;
 }

    

  .fa-facebook-square,
  .fa-google,
  .fa-user {
    font-size: 15px;
  }

  .registro {
    margin-top: 10px;
    font-size: 0.7em;
  }



}