:root {
	--primary-color: #0d6efd;
	--secondary-color: LightGrey;   /*#6c757d*/
	--dark-bg: #212529;
      }
body {font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;	overflow-x: hidden; }
.hero-section {
	position: relative; height: 85vh;
  background: url(../img/elfondo.png) no-repeat center center/cover;
	display: flex; align-items: center; justify-content: center; color: white; }
.hero-overlay {
	position: absolute;
	top: 0;	left: 0;	width: 100%; height: 100%;
	background: rgba(0, 0, 0, 0.5);	z-index: 1;  }
.hero-content {
	position: relative;	z-index: 2;	text-align: center;
	max-width: 800px;  padding: 20px;            }
.hero-title {font-size: 3rem; font-weight: 700;	margin-bottom: 20px; }
.hero-subtitle {font-size: 1.5rem; margin-bottom: 30px; }
.service-card {
	transition: transform 0.3s ease, box-shadow 0.3s ease;
	border: none;	border-radius: 10px; height: 100%; background: #fff;
	box-shadow: 0 4px 6px rgba(0,0,0,0.1);       }
.service-card:hover {transform: translateY(-10px); box-shadow: 0 10px 20px rgba(0,0,0,0.15); }
.service-icon {font-size: 3rem;	color: var(--primary-color); margin-bottom: 20px;     }
legend {text-align: center; margin: 0; padding: 0; filter: drop-shadow(1px 1px 2px LightBlue); }
.navbar {
	background-color: rgba(255, 255, 255, 0.95);
	backdrop-filter: blur(10px); box-shadow: 0 2px 10px rgba(0,0,0,0.1);   }
.navbar-brand {font-weight: 800;	color: var(--primary-color) !important;	font-size: 1.5rem; }
.modal-header {background-color: var(--primary-color); color: white; text-align: center; }
.form-control.is-invalid {
	border-color: #dc3545;
  background-image: url(../img/error.webp); /*no.ico*/
	background-repeat: no-repeat;
	background-position: right calc(0.375em + 0.1875rem) center;
	background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem);    }
.invalid-feedback {display: block; color: #dc3545;	font-size: 0.875em; margin-top: 0.25rem;  }
.bi {vertical-align: -0.125em; }
/* Estilo para fondo de avisos para pantallas grandes */
.elemento {
  text-align: center; width: 50%; margin-top: 6rem; background: beige;
  filter: drop-shadow(3px 3px 4px DarkGoldenRod);                     }
/* Estilo para fondo de avisos para pantallas pequeñas (móviles) */
@media (max-width: 800px) {
.elemento {
  text-align: center; width: 90%; margin-top: 12rem;
  filter: drop-shadow(2px 2px 3px DarkGoldenRod);  }
}   /* Final de @media (max-width: 800px) */
.custom-tooltip {--bs-tooltip-bg: var(--bs-blue); --bs-tooltip-color: var(--bs-white); }
.error { color: #d32f2f; font-size: 0.9em; margin-top: 5px; }









       /* #6c757d  font-weight: bold;  #bbdefb   color: white*/
.pie {max-width: 100%; text-align: center; padding: 10px;;
      background-color: var(--secondary-color); }