/* Importar la fuente Montserrat de Google Fonts */
@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');


/* Reglas generales para el body y HTML */
html, body {
    margin: 0;
    padding: 0;
    height: 100%; /* Asegura que el body ocupe la altura completa */
    overflow-x: hidden; /* Evita el scroll horizontal */
    font-family: 'Poppins', sans-serif; /* Tipografía Montserrat */
    font-size: 20px; /* Tamaño de fuente por defecto */
    color: #e5e5e5; /* Color de texto blanco por defecto */
    background-color: #000000; /* Color de fondo negro */
}
p { margin:0px 0px 0px 0px; padding: 0px 0px 0px 0px;}

/* Contenedor principal para la imagen de fondo y el contenido */
.main-wrapper {
    position: relative; /* Para posicionar elementos internos */
    width: 100%;
    min-height: 100vh; /* Ocupa el 100% del alto de la ventana del navegador */
    background-image: url('image/Big-Den-Records-Slider-Home.jpg'); /* Imagen de fondo */
    background-size: cover; /* La imagen cubre todo el contenedor, manteniendo proporciones */
    background-position: top center; /* Alinea la imagen al top y centro */
    background-repeat: no-repeat; /* No repite la imagen */
    display: flex; /* Usamos flexbox para centrar el contenido verticalmente si es necesario */
    flex-direction: column; /* Apila los elementos verticalmente */
    justify-content: flex-start; /* Alineación vertical al top */
    align-items: center; /* Alineación horizontal al centro */
    padding: 0px; /* Margen superior de 16px para el contenido general */
    box-sizing: border-box; /* Incluye padding y borde en el tamaño total */
}

/* Div con class="ContentContenido01" para el degradado y el contenido */
.ContentContenido01 {
    width: 100%; /* Ocupa el 100% del ancho */
    /* La altura se ajustará automáticamente al contenido */
    background: linear-gradient(to bottom, rgba(0, 0, 0, 1) 30%, rgba(0, 0, 0, 0) 100%); /* Degradado de negro a transparente */
    display: flex;
    flex-direction: column; /* Apila el contenido (logo y textos) verticalmente */
    justify-content: flex-start; /* Alineación vertical al top */
    align-items: center; /* Alineación horizontal al centro */
    padding: 30px 30px 80px 30px; /* Espacio inferior para separar del borde inferior del degradado si el contenido es corto */
    box-sizing: border-box; /* Incluye padding en el tamaño total */
}

/* Estilos para el logotipo */
.logo {
    width: 180px; /* Ancho especificado */
    height: 85px; /* Alto especificado */
    display: block; /* Asegura que la imagen sea un bloque y se centre con margin auto */
	padding: 0px 0px 0px 0px;
    margin: 0px 0px 0px 0px; /* Espacio debajo del logo */
    object-fit: contain; /* Asegura que la imagen se ajuste sin recortarse si las dimensiones no son exactas */
}

/* Estilos para las cajas de texto */
.text-box-01 {
    max-width: 360px; /* Ancho máximo para que el texto no se extienda demasiado en pantallas grandes */
    text-align: center; /* Centra el texto dentro de la caja */
    margin: 20px auto 0px auto; /* Centra la caja horizontalmente, añade margen inferior */
    padding: 0px 0px 0px 0px; /* Padding horizontal para que el texto no toque los bordes en móviles */
    
}

.text-box-01 p {
    margin: 0px 0px 0px 0px; /* Centra la caja horizontalmente, añade margen inferior */
    padding: 0px 0px 0px 0px; /* Padding horizontal para que el texto no toque los bordes en móviles */
	font-family: 'Poppins', sans-serif;
	font-weight: 300;
	font-size: 16px; /* Tamaño de fuente por defecto */
    color: #e5e5e5; /* Color de texto blanco por defecto */
    line-height: 1.2; /* Espaciado de línea para mejor legibilidad */
}
.text-box-01 p a{
    font-family: 'Poppins', sans-serif;
	font-weight: 500;
	font-size: 16px; /* Tamaño de fuente por defecto */
    color: #e5e5e5; /* Color de texto blanco por defecto */
    line-height: 1.2; /* Espaciado de línea para mejor legibilidad */
	text-decoration: none;
}
.text-box-01 p a:hover{
	color: #333333; /* Color de texto blanco por defecto */
}

.text-box-02 {
    max-width: 360px; /* Ancho máximo para que el texto no se extienda demasiado en pantallas grandes */
    text-align: center; /* Centra el texto dentro de la caja */
    margin: 40px auto 0px auto; /* Centra la caja horizontalmente, añade margen inferior */
    padding: 0px 0px 0px 0px; /* Padding horizontal para que el texto no toque los bordes en móviles */
    
}

.text-box-02 p {
    margin: 0px 0px 0px 0px; /* Centra la caja horizontalmente, añade margen inferior */
    padding: 0px 0px 0px 0px; /* Padding horizontal para que el texto no toque los bordes en móviles */
	font-family: 'Poppins', sans-serif;
	font-weight: 300;
	font-size: 20px; /* Tamaño de fuente por defecto */
    color: #dca000; /* Color de texto blanco por defecto */
    line-height: 1.2; /* Espaciado de línea para mejor legibilidad */
}