h2{text-align: center;}
  h4{text-align: center;}
  p {text-align: center;color:red; font-weight:bold; text-align:center ;font-size:20px;}

  body {font-family: Georgia, "Times New Roman",
              Times, serif; background-color: #EBEDEF;
              margin:0;
              
  }

  #contenido{background-color: #D6DBDF}
  
  #footer{text-align: center;background-color:#EBEDEF}
  #cuerpo_principal {
  	margin: auto;
  	width:1100px;
  	height:auto;
  }
/*--#login{background-color: #D6DBDF}
/*-- abre de barra de navegacion */
  ul {
      list-style-type: none;
      margin: 1;
      padding: 0;
      overflow: hidden;
      background-color: #34495E;
      width: 100%; height: auto;
  }

  li {
      float: right;
  }

  li a {
      display: block;
      color: white;
      text-align: center;
      padding: 14px 16px;
      text-decoration: none;
  }
  li #login {
      display: block;
      color: white;
      text-align: center;
      padding: 14px 16px;
      text-decoration: none;
  }

  /* Change the link color to #111 (black) on hover */
  li a:hover {
      background-color: #111;
  }
/*-- cierre de barra de navegacion */


  p, h3{
  color: red;
  margin-top: 8px;
  text-align:center;
  }

    .header img {
      float: left;
      width: 170px;
      height: 150px;
      margin-top: 0px;

      }

    .header h2 {
      position:relative;
      top: 18px;
      }
    .header h4 {
      position: relative;
      top: 1px;
      }
    /* quitar espacio entre h3y h4*/
    .greeting h2 {
      margin:0px;
      line-height:120px;
    }
    .greeting h4{
      margin:0px;
      line-height:10px;
    }


/* cajas de texto*/
    input[type="text"] {
        font-size:20px;
    }
    input[type="password"] {
        font-size:20px;
    }
    /*--       cuadros alta usuarios  --*/
    input[type="button"]{
        color:#000000;
      	display:inline-block;
      	font-size:0.4em;
      	margin:5px;
      	padding:2px 0;
      	text-align:center;
      	width:180px;
      	text-decoration:none;
      	box-shadow:0px 2px 0px #373c3c;
        border-radius:30px;
        font-size:12px;
    }

    input[type="search"] {
        font-size:15px;
        width: 180px;
    }
    input[type="reset"] {
      color:#000000;
      display:inline-block;
      font-size:0.4em;
      margin:5px;
      padding:2px 0;
      text-align:center;
      width:180px;
      text-decoration:none;
      box-shadow:0px 2px 0px #373c3c;
      border-radius:30px;
      font-size:12px;
    }

#select_area{
  -webkit-appearance: menulist-textfield;
  height:29px;
  width: 250px;
}
#area{
  -webkit-appearance: menulist-textfield;
  height:29px;
  width: 250px;
}
#select_admin{
  -webkit-appearance: menulist-textfield;
  height:29px;
  width: 250px;
}
#select_rol{
  -webkit-appearance: menulist-textfield;
  height:29px;
  width: 250px;
}

#select_unidad{
  -webkit-appearance: menulist-textfield;
  height:29px;
  width: 180px;
}
#select_material{
  -webkit-appearance: menulist-textfield;
  height:29px;
  width: 250px;
}
#select_componente{
  -webkit-appearance: menulist-textfield;
  height:29px;
  width: 250px;
}
#select_actividad{
  -webkit-appearance: menulist-textfield;
  height:29px;
  width: 250px;
}
#select_grado{
  -webkit-appearance: menulist-textfield;
  height:29px;
  width: 180px;
}
#select_mat{
  -webkit-appearance: menulist-textfield;
  height:29px;
  width: 180px;
}
#select_partida{
  -webkit-appearance: menulist-textfield;
  height:29px;
  width: 180px;
}


datalist {
  height: 29px
  width: 250px;
}

    /* -------------------------------------tamaño de select de captura requerimiento------------------------------------------------------- */
    select{
  -webkit-appearance: menulist-textfield;
  height:28px;
}



/*-- ....................botones del menú--------------- --*/
.button {
	background:#EBEDEF;
	color:#000000;
	display:inline-block;
	font-size:1.25em;
	margin:20px;
	padding:10px 0;
	text-align:center;
	width:200px;
	text-decoration:none;
	box-shadow:0px 3px 0px #373c3c;
}
.submit {
	background:#EBEDEF;
	color:#000000;
	display:inline-block;
	font-size:.75em;
	margin:5px;
	padding:3.5px 0;
	text-align:center;
	width:80px;

	text-decoration:none;
	box-shadow:0px 3px 0px #373c3c;
}

.button span {
	margin-right:10px;
}


/*Tamaños*/
.button.medium {
	width:350px;
}
.submit.medium {
	width:180px;
}

.button.radius {
	border-radius:50px;
}
.submit.radius {
	border-radius:50px;
}

/*Efectos, Hover*/
.button:hover {
	box-shadow:0px 0px 0px;
	padding-top:7px;
}




label{display: inline-block;  text-align: right; }


/* Este es nuestro diseño para los campos no válidos */
input.invalid{
  border-color: #900;
  background-color: #FDD;
}

input:focus.invalid {
  outline: none;
}

/* Este es el diseño para nuestros mensajes de error */
.error {
  width : 100%;
  padding: 0;

  font-size: 80%;
  color: white;
  background-color: #900;
  border-radius: 0 0 5px 5px;
  box-sizing: border-box;
}

.error.active {
  padding: 0.3em;
}

/*combos en la misma línea */
.input_div{
  display: flex;
  flex-direction:column;
}

.input_container{
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-gap: 20px;
}