/* General Settings */
/* Personalización de la barra de scroll */
::-webkit-scrollbar {
	width: 8px; /* Ancho de la barra de scroll */
	height: 8px; /* Altura de la barra de scroll (para desplazamiento horizontal) */
  }
  
  ::-webkit-scrollbar-track {
	background: rgb(255, 255, 255);
   /* Fondo de la barra */
	border-radius: 10px; /* Bordes redondeados */
  }
  
  ::-webkit-scrollbar-thumb {
	background: #888; /* Color del "thumb" (parte móvil) */
	border-radius: 10px; /* Bordes redondeados */
	transition: background 0.3s ease; /* Transición para un efecto suave */
  }
  
  ::-webkit-scrollbar-thumb:hover {
	background: #555; /* Color del "thumb" al pasar el mouse por encima */
  }
  
  /* Para navegadores que no soportan WebKit */
  .scrollbar {
	scrollbar-width: thin; /* Estilo de barra más delgada (Firefox) */
	scrollbar-color: #888 #f1f1f1; /* Color del thumb y track (Firefox) */
  }
  html {
	scroll-behavior: smooth; /* Suaviza el desplazamiento */
  }
  
  body{
	  
	  background-image: url(../imagen/FONDO1.png) ;
	  
  
	  background-image: url(../imagen/FONDO1.png);
	  background-size: cover;
	  background-attachment: fixed;
  
	  
  
  }
  #cabecera {
	display: flex; /* Usar flexbox para organizar los elementos */
	align-items: center; /* Centra verticalmente los elementos */
	justify-content: space-between; /* Asegura espacio entre el logo y el texto */
	background: linear-gradient(190deg, #414743, #1C2023);
	padding: 20px;
	color: #f7ad53;
  }
  
  #logo {
	display: flex;
	align-items: center; /* Centra verticalmente el logo */
	justify-content: flex-start; /* Alinea a la izquierda */
  }
  
  #logo img {
	margin-right: 20px; /* Espacio entre la imagen y el texto del logo */
  }
  
  #cabecera h1 {
	font-family: "The Army Of God", sans-serif;
	font-size: 55px;
	text-align: center; /* Centra el texto dentro del contenedor de texto */
	margin: 0; /* Elimina márgenes */
	flex-grow: 1; /* Hace que el texto ocupe el espacio restante */
  }
  
  #cabecera h2 {
	font-family: "Agency FB", sans-serif;
	font-size: 40px;
	font-weight: bold;
	text-align: center;
	margin: 0;
	
  }
  
  /* Media Query para pantallas pequeñas */
  @media (max-width: 768px) {
	#cabecera {
	  flex-direction: column; /* Cambia la disposición a columna */
	  align-items: center; /* Centra todo horizontalmente */
	}
  
	#logo {
	  justify-content: center; /* Centra el logo en pantallas pequeñas */
	  margin-bottom: 10px; /* Espacio inferior entre el logo y el texto */
	}
  
	#cabecera h1 {
	  text-align: center;
	  flex-grow: 0; /* Elimina el comportamiento de expansión */
	}
  }
  .resaltar {
	margin: 0; /* Elimina márgenes */
	text-align: center; /* Alineación a la izquierda */
  
  }
  
  
  
  /* Cambiar el color de fondo del botón */
  .custom-bg-color {
	background-color: #ffffff; /* Color de fondo personalizado */
  }
  
  /* Cambiar color de las líneas del icono */
  
  
  /* Personalizar las barras del ícono */
  .navbar-toggler-icon::before, 
  .navbar-toggler-icon::after,
  .navbar-toggler-icon span {
	background-color: #ff0000; /* Color de las líneas */
  }
  
  /* Si quieres personalizar el grosor de las líneas, también puedes hacerlo */
  .navbar-toggler-icon::before, 
  .navbar-toggler-icon::after {
	height: 1px; /* Grosor de las líneas */
	background-color: aqua;
  }
  
  
  
  
  
  
  .navbar{
	background: #1C2023;
	
	font-family:"Agency FB";
	font-size: 23px;
	font-weight: bold;
  }
  
  .navbar li a {
	background-color:#1C2023;
	color: #f7ad53;
  
	text-decoration:none;
	padding:10px 15px;
	display:block;
	
  
  }
  .navbar li a:hover{
	background-color:#fdfbff;
   color: black;
   border-radius: 10px;
  
  
  }
  
  .navbar > li{
	float:left;
  }
  
  .navbar li ul{
	display: none;
	position: absolute;
	min-width: 140px;
  }
  
  .navbar li:hover> ul{
  display:block;
  }
    li{
	font-size: 25px;
	}
  

  .card-title{

    font-size: 25px;
  font-family: "Agency FB";
  font-weight: bold;
  
  }


  



  

  

  

	footer {
	  position: relative; /* Cambiado a relative para que se ajuste al contenido */
	  width: 100%;
	  height: 100%;
	  background-color: rgb(0, 0, 0);
	  text-align: center;
	  padding: 10px 0; /* Espaciado interno */
	  bottom: auto;
    }
	  q{
		  font-size: 15px;
	  color: white;
	  font-family: "Agency FB";
	  font-weight: bold;
	  }
	  .f1{
		color: rgb(255, 251, 0);
		   
	  }
   
	  p{
		text-align: left;
		margin-left: 10px;
		justify-content: center;
	  font-size: 25px;
	  color: rgb(255, 255, 255);
	  font-family: "Agency FB";
	  font-weight: bold;
	  }