/********** Resolucion para movil ***************/
@media (max-width:1024px)
{
header {
  border-bottom: 2px solid #eee;
  padding: 5px 0;
  margin-bottom: 10px;
  width: 100%;
  text-align: center;
  color: #F2F5F8;
  background-color: #33B5FF;  /* #563  */
}

body {
  font-family: 'Courier new', sans-serif;
  font-size: 50px;
  text-align: center;
  background-color: lightblue;
}

/* Titulo */
h1 {
  font-size: 125%;
  margin-top: 2%;
  margin-bottom: 2%;
}
/* Subtitulo */
h2 {
  font-size: 80%;
  padding: 2%;
  margin-top: 2%;
  margin-bottom: 2%;
}

/*  colocacion de las entradas y boton */
form.f1{
  display: flex;
  flex-direction: column;
  align-items: center;
}

/* inputs  user y pass */
input.i1{
  width: 27%;
  height: 85px;
  font-size: 95%;
  margin: 4%;
}

/* Boton enviar user y pass */
input.but1{
  width: 24%;
  padding: 3%;
  color: #fff;
  background: #0098cb;
  font-size: 79%;
  margin-top: 6%;
}

/* Letras 'dia semana' */
b.dia{
  font-size: 50px;
}
/* Linea completa de programa diario */
h3{
  margin: 0%;
}
/* Entrada de horas o duracion */

input.but1{
  width: 45%;
  padding: 3%;
  color: #fff;
  background: #0098cb;
  font-size: 85%;
  margin-top: 3%;
}
input.but1:hover { background-color: #00b8eb;}

input.but2{
  width: 45%;
  padding: 3%;
  color: #fff;
  background: #0098cb;
  font-size: 85%;
  margin-top: 3%;
}
input.but2:hover { background-color: #00b8eb;}
}

/********** Resolucion para PC ***********/

@media (min-width:1025px)
{
  header {
    border-bottom: 2px solid #eee;
    padding: 5px 0;
    margin-bottom: 0px;
    width: 100%;
    text-align: center;
    color: #F2F5F8;
    background-color: #23A5EF;  /* #563  */
  }

  body {
    font-family: 'Courier new', sans-serif;
    font-size: 50px;
    text-align: center;
    background-color: lightblue;
  }

  /* Titulo */
  h1 {
    font-size: 89%;
    margin-top: 2%;
    margin-bottom: 2%;
  }
  /* Subtitulo */
  h2 {
    font-size: 59%;
    padding: 1%;
    margin-top: 0%;
    margin-bottom: 0%;
  }

  /* Linea h3 */
  h3{
    margin-right: 30%;
    margin-left: 32%;
    margin-top: 1%;
    margin-bottom: 1%;
  }

  /*  colocacion de las entradas y boton */
  form.f1{
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  /* inputs  user y pass */
  input.i1{
    width: 10%;
    height: 33px;
    font-size: 47%;
    margin: 1%;
  }

  /* Boton enviar user y pass */
  input.but1{
    width: 12%;
    padding: 1%;
    color: #fff;
    background: #0098cb;
    font-size: 50%;
    margin-top: 4%;
  }
  input.but1:hover { background-color: #00b8eb;}


}
