html {
	height: 100%;
	min-height: 400px;
/* 	background-image: url('img/annp_fachada.jpg'); */
	background-size: cover;
/* 	border-top: 20px solid grey; Ajusta el tamaño del borde superior */
    border-right: 20px solid grey; /* Ajusta el tamaño y el color del borde según tus necesidades */
    border-left: 20px solid grey; /* Ajusta el tamaño y el color del borde según tus necesidades */
/*     border-bottom: 20px solid grey; Ajusta el tamaño y el color del borde según tus necesidades */
    box-sizing: border-box; /* Asegura que el borde se incluya dentro del tamaño total del elemento */
    border-radius: 5px;
}

/* body { */
/* /* 	background-image: url('ruta/a/la/imagen.jpg'); */ */
/* 	background-size: cover; */
/* 	background-position: center; */
/* 	background-attachment: fixed; */
/* 	font-family: Arial, sans-serif; */
/* } */
body {
  margin: -5;
  padding:-5;
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100vh;
  background: linear-gradient(to bottom, #000000, #111111); /* Cambia los colores de gradiente según tus preferencias */
/*   border-top: 40px solid grey; Ajusta el tamaño del borde superior */
/*   border: 20px solid grey; Ajusta el tamaño y el color del borde según tus necesidades */
/*   box-sizing: border-box; Asegura que el borde se incluya dentro del tamaño total del elemento */
}
 .container {
      position: relative;
      margin: 50px;
      border: 50px solid black; /* Ajusta el tamaño y el color del borde según tus necesidades */
      box-sizing: border-box; /* Asegura que el borde se incluya dentro del tamaño total del elemento */
    }
.background-container {
  background-image: url("img/annp_fachada.jpg");
  background-size: cover;
}
form {
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	background-color: rgba(247, 247, 247, 60%);
	padding: 20px;
	padding-bottom: 0px;
	border-radius: 10px;
	width: 400px;
	margin: 0 auto;
	margin-top: -0%;
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
}

input[type="text"], input[type="password"] {
	width: 95%;
	padding: 10px;
	margin-bottom: 10px;
	border: none;
	border-radius: 5px;
	background-color: #eee;
}

.campoCap {
    width: 17% !important; /* ajustá como quieras */
    padding: 10px;
    margin-left: 30px !important;
    margin-bottom: 10px;
    border: none;
    border-radius: 5px;
    background-color: #eee;
}

input[type="idVerifyCaptcha"] {
	width: 15%;
	padding: 10px;
	margin-bottom: 10px;
	border: none;
	border-radius: 5px;
	background-color: #eee;
}

input[type="submit"] {
	/* sacar el width si va a volver abajo centrado */
	width: 46%;
	background-color: #1b316c;
	color: white;
	padding: 10px 20px;
	border: none;
	border-radius: 5px;
	cursor: pointer;
	/* si coloco solo en una linea usar este margin para dejar centrado */
	/* margin-left: 140px; */
}

input[type="submit"]:hover {
	background-color: #02488c;
}

h3 {
	margin-top: -8px;
	text-align: center;
	margin-bottom: 10px;
	color: #333;
	text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5);
}

.recuadro {
	position: fixed;
	bottom: 5px;
	left: 50%;
	transform: translateX(-50%);
	width: 220px;
	height: 150px;
	background-color: white;
	border: 1px solid black;
	border-radius: 5px;
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
	z-index: 999; /
	padding: 20px;
	padding-bottom: 15px; /* Achica el margen inferior del recuadro */
	opacity: 0.8; /* Aplica transparencia al recuadro */
}

.logo-correo {
	max-width: 25px;
	height: 25px;
	/* padding-top: 3px; */
	/* background: transparent;
	background-repeat: no-repeat; */
}

.logo-captcha {
	width: 90px;
	height: 37px;
	vertical-align: middle;
	margin-left: 30px !important;
	/* padding-top: 3px; */
	/* background: transparent;
	background-repeat: no-repeat; */
}

.logo-annp {
/*   max-width: 30px; */
  position: fixed;
  top: 15px;
  right: 10px;
  margin: 10px;
  width: 30px;
  height: 90px;
/*   opacity: 0.2; */
}

h4 {
	margin-top: 0px;
	margin-bottom: 0px;
	text-align: center;
	color:#061233;
}

pre {
	margin-top: 2px;
	margin-left: -112px;
	font-family: Arial, sans-serif;
	font-size: 14.5px;
}

button {
	background: transparent;
	background-image: url('/home/user/Descargas/mail-verde.png');
	background-repeat: no-repeat;
	/* background-position: center center; */
	border: none;
	width: 25px;
	height: 25px;
	padding-left: 5px;
	/* otros estilos adicionales */
}
.actionButtons {
	width: 50%;
	padding: 15px 0% 15px 0%;
	margin: 0 25% 0 25%;
	clear: both;
	text-align:center;	
}
.footer {
	position: fixed;
	bottom: 0;
	right: 0;
	color: #e0e1e3;
	width: 100%;
	box-sizing: border-box;
	height: 80px;
	padding: 0 24px;
	border-right: 20px solid grey; 
    border-left: 20px solid grey;
}

.footer #clock {
	position: fixed; /* Fija el elemento en la pantalla */
	left: 50%; /* Lo sitúa en la mitad del ancho del viewport */
	bottom: 0; /* Lo sitúa en la parte inferior de la pantalla */
	transform: translateX(-50%);
	/* Lo desplaza hacia la izquierda la mitad de su ancho */
	float: center;
	font-size: 36px;}
	height: 36px;
	line-height: 0;
	/* position:relative; */
	top: 42px;
	padding: 0;
}