.invalid {
	border: solid 1px red;
	box-shadow: 0 0 10px red;
	font-weight: bold;
}
form .error {
	color: red;
	display: block;
	text-align: left;
	font-weight: bold;
}
input.masked,p.shell span {
	font-size: 16px;
	font-family: monospace;
	padding-right: 10px;
	background-color: transparent;
	text-transform: uppercase;
}
form .error {
	color: #ff0000;
}
.dataTables_wrapper .dataTables_filter {
	float: none;
	text-align: center;
}
.select2 {
	width:100%!important;
}
.loader{
	position: absolute;
	top: 0;
	left: 0%;
	width: 50%;
	height: 50%;
	/*yo usaré background blanco porque mi gif es blanco*/
	/*background: #fff;*/
	display: none;
}
.loader img{
	position: absolute;
	top: 100%;
	left: 100%;
	transform: translate(-50%, -50%);
	width: 100px;
}
.dt-back-head {
	background-color:blue;
}
.my-card{
	width: 500px;
	height: 500px;
}
#progress-container {
  width: 500px;
  background-color: #f3f3f3;
  border: 1px solid #ccc;
  height: 20px;
  position: relative;
  text-align: center; /* Para centrar el texto */
}

.progress-bar {
  width: 0%; /* Ancho inicial */
  height: 100%;
  background-color: #4CAF50; /* Color de la barra de progreso */
  transition: width 0.5s ease; /* Animación de transición */
}

#progress-text {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  color: black;
}
/*Caption DataTable*/
caption{
	text-align: center;
	color: #ffffff;
	font-weight: bold;
	background-color: #007bff;
	caption-side: top;

}