﻿html, body {
	background-color: black; /* Fondo negro */
	color: white; /* Tipografía blanca */
	font-family: 'Nunito', sans-serif;
}

.video-thumbnail {
	cursor: pointer;
	max-width: 100%;
	border-radius: 8px;
}

.video-container {
	text-align: center;
}

/* Estilo para hacer el carrusel horizontal */
#videoCarousel .carousel-inner {
	display: flex; /* Flexbox para mostrar los items en fila */
	flex-wrap: nowrap; /* Evita que los elementos se envuelvan en una nueva línea */
	overflow-x: auto; /* Permite el desplazamiento horizontal si hay más videos */
}

#videoCarousel .carousel-item {
	flex: 0 0 auto; /* Asegura que cada video tenga un ancho fijo y no se estire */
	width: 100%; /* O ajusta el tamaño que desees para cada video */
}

/* Estilo para las miniaturas de los videos */
#discoThumbs {
	display: flex;
	overflow-x: auto; /* Desplazamiento horizontal si hay muchas miniaturas */
	margin-top: 20px;
}

	#discoThumbs img {
		cursor: pointer;
		margin-right: 10px;
		border-radius: 8px;
		max-width: 100px; /* Tamaño fijo de las miniaturas */
		transition: transform 0.3s ease; /* Efecto al pasar el ratón */
	}

		#discoThumbs img:hover {
			transform: scale(1.1); /* Efecto de zoom al pasar el ratón sobre las miniaturas */
		}

.navbar {
	background-color: black !important; /* Fondo negro */
	padding: 10px;
	width: 100%;
	display: flex;
	justify-content: center; /* Centra horizontalmente el contenido */
	align-items: center; /* Centra verticalmente */
}

	.navbar .container {
		background-color: black !important; /* Asegura que el fondo dentro del navbar sea negro */
		display: flex;
		justify-content: center; /* Centra el contenido dentro del navbar */
		align-items: center;
		flex-direction: column;
	}

.navbar-collapse {
	background-color: black !important; /* Fondo negro en el menú desplegable en móviles */
}

.navbar-toggler {
	background-color: white; /* Color del botón de hamburguesa */
}

.navbar a.active {
	background-color: red; /* Color del enlace seleccionado */
}

.navbar-brand img {
	display: block;
	margin: 0 auto; /* Asegura que la imagen esté centrada */
}

.navbar-nav {
	width: 100%;
	display: flex;
	justify-content: center; /* Centra los enlaces */
}

.navbar-custom {
	background-color: rgba(0, 0, 0, 0.8) !important; /* Negro con transparencia */
}
