body {
    padding: 0;
    margin: 0;
    overflow-x: hidden; /* Evitar scroll horizontal en dispositivos móviles */
   
}

#galaxy {
    z-index: 0;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh; /* Ajusta la altura según sea necesario */
    background: #03092b;
    overflow-y: scroll;
    -webkit-transition: background 0.8s ease-out;
    -moz-transition: background 0.8s ease-out;
    -o-transition: background 0.8s ease-out;
    -ms-transition: background 0.8s ease-out;
    transition: background 0.8s ease-out;
}

.video-container {
	background-position: center;
	background-size: contain;
	width: 50vh;
	height: 20vh; /* Reducida la altura para dejar espacio para las otras imágenes */
	position: absolute;
	top: 130vh; /* Ajusta la posición desde la parte superior según sea necesario */
	left: 50%;
	transform: translateX(-50%);
	z-index: 1;
}

.video-container-2 {
	background-position: center;
	background-size: contain;
	width: 50vh;
	height: 20vh; /* Reducida la altura para dejar espacio para las otras imágenes */
	position: absolute;
	top: 240vh; /* Ajusta la posición desde la parte superior según sea necesario */
	left: 50%;
	transform: translateX(-50%);
	z-index: 1;
}
iframe {
	width: 100%;
	height: 100%;
	object-fit: cover;
}


#galaxy,
#galaxy * {
	position: absolute;
}
#galaxy .bg {
	width: 100%;
	height: 400vh;
}

/* Estilos generales para versiones mayores a 767px */
#galaxy .bg {
    background: url('https://i.etsystatic.com/26911459/r/il/decb5f/2763526562/il_1140xN.2763526562_9o07.jpg') no-repeat center center fixed;
    background-size: cover;
    width: 100%;
    height: 400vh;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
}




#galaxy [class^="stars"] {
    width: 100vw;
    height: 100vh;
    position: fixed;
    top: 0;
    left: 0;
}

#galaxy .stars-back {
    background: url('https://raw.githubusercontent.com/gurde/css3-animated-galaxy/master/img/back.png');
    -webkit-animation: orbit-clock-wise 440s infinite linear;
    -moz-animation: orbit-clock-wise 440s infinite linear;
    -o-animation: orbit-clock-wise 440s infinite linear;
    -ms-animation: orbit-clock-wise 440s infinite linear;
    animation: orbit-clock-wise 440s infinite linear;
}

#galaxy .stars-middle {
    background: url('https://raw.githubusercontent.com/gurde/css3-animated-galaxy/master/img/middle.png');
    -webkit-animation: orbit-counter-clock-wise 360s infinite linear;
    -moz-animation: orbit-counter-clock-wise 360s infinite linear;
    -o-animation: orbit-counter-clock-wise 360s infinite linear;
    -ms-animation: orbit-counter-clock-wise 360s infinite linear;
    animation: orbit-counter-clock-wise 360s infinite linear;
}

#galaxy .stars-front {
    background: url('https://raw.githubusercontent.com/gurde/css3-animated-galaxy/master/img/front.png');
    -webkit-animation: orbit-clock-wise 160s infinite linear;
    -moz-animation: orbit-clock-wise 160s infinite linear;
    -o-animation: orbit-clock-wise 160s infinite linear;
    -ms-animation: orbit-clock-wise 160s infinite linear;
    animation: orbit-clock-wise 160s infinite linear;
}
@-webkit-keyframes orbit-clock-wise {
	0% { opacity: 0.4; -webkit-transform: rotate(0deg); }
	2% { opacity: 0.8; }
	4% { opacity: 0.2; }
	5% { opacity: 0.8; }
	100% { opacity: 0.4; -webkit-transform: rotate(360deg); }
}
@-webkit-keyframes orbit-counter-clock-wise {
	from { -webkit-transform: rotate(360deg); } to { -webkit-transform: rotate(0deg); }
}
@-moz-keyframes orbit-clock-wise {
	0% { opacity: 0.4; -moz-transform: rotate(0deg); }
	2% { opacity: 0.8; }
	4% { opacity: 0.2; }
	5% { opacity: 0.8; }
	100% { opacity: 0.4; -moz-transform: rotate(360deg); }
}
@-moz-keyframes orbit-counter-clock-wise {
	from { -moz-transform: rotate(360deg); } to { -moz-transform: rotate(0deg); }
}
@-o-keyframes orbit-clock-wise {
	0% { opacity: 0.4; -o-transform: rotate(0deg); }
	2% { opacity: 0.8; }
	4% { opacity: 0.2; }
	5% { opacity: 0.8; }
	100% { opacity: 0.4; -o-transform: rotate(360deg); }
}
@-o-keyframes orbit-counter-clock-wise {
	from { -o-transform: rotate(360deg); } to { -o-transform: rotate(0deg); }
}
@-ms-keyframes orbit-clock-wise {
	0% { opacity: 0.4; -ms-transform: rotate(0deg); }
	2% { opacity: 0.8; }
	4% { opacity: 0.2; }
	5% { opacity: 0.8; }
	100% { opacity: 0.4; -ms-transform: rotate(360deg); }
}
@-ms-keyframes orbit-counter-clock-wise {
	from { -ms-transform: rotate(360deg); } to { -ms-transform: rotate(0deg); }
}
@keyframes orbit-clock-wise {
	0% { opacity: 0.4; transform: rotate(0deg); }
	2% { opacity: 0.8; }
	4% { opacity: 0.2; }
	5% { opacity: 0.8; }
	100% { opacity: 0.4; transform: rotate(360deg); }
}
@keyframes orbit-counter-clock-wise {
	from { transform: rotate(360deg); } to { transform: rotate(0deg); }
}
.logo-link {
    display: block;
    width: 100vw;
    height: 10vh;
    position: absolute;
    top: 2vh;
    left: 50%;
    transform: translateX(-50%);
    z-index: 2; /* O cualquier valor mayor que 1 */
}

.custom-logo {
    background: url('Links/logo.png') no-repeat;
    background-position: center;
    background-size: contain;
    width: 100%;
    height: 100%;
}
.logo-link-2 {
    display: block;
	width: 100%;
    height: 35vh; /* Reducida la altura para dejar espacio para las otras imágenes */
    position: absolute;
    top: 65vh; /* Ajusta la posición desde la parte superior según sea necesario */
    left: 50%;
    transform: translateX(-50%);
    z-index: 2;
}

.custom-image {
    background: url('Links/Cont-ctanos-y-ases-rate-para-v-23-2-2024.png') no-repeat;
    background-position: center;
    background-size: contain;
    width: 100%;
    height: 100%;

}

#galaxy .custom-image-2 {
    background: url('Links/vive_la_experiencia.png') no-repeat;
    background-position: center;
    background-size: contain;
    width: 100vw;
    height: 20vh; /* Reducida la altura para dejar espacio para las otras imágenes */
    position: absolute;
    top: 15vh; /* Ajusta la posición desde la parte superior según sea necesario */
    left: 50%;
    transform: translateX(-50%);
    z-index: 1;
}

#galaxy .custom-image-3 {
    background: url('Links/disney.png') no-repeat;
    background-position: center;
    background-size: contain;
    width: 30vw;
    height: 20vh; /* Reducida la altura para dejar espacio para las otras imágenes */
    position: absolute;
    top: 43vh; /* Ajusta la posición desde la parte superior según sea necesario */
    left: 40%; /* Ajusta la posición hacia la izquierda según sea necesario */
    transform: translateX(-50%);
    z-index: 1;
}

#galaxy .custom-image-4 {
    background: url('Links/tecate.png') no-repeat;
    background-position: center;
    background-size: contain;
    width: 30vw;
    height: 20vh; /* Reducida la altura para dejar espacio para las otras imágenes */
    position: absolute;
    top: 48vh; /* Ajusta la posición desde la parte superior según sea necesario */
    left: 60%; /* Ajusta la posición hacia la derecha según sea necesario */
    transform: translateX(-50%);
    z-index: 1;
}



#galaxy .custom-image-5 {
    background: url('Links/Con-control-dmx-23-2-2024-5.png') no-repeat;
    background-position: center;
    background-size: contain;
    width: 80%;
    height: 30vh; /* Reducida la altura para dejar espacio para las otras imágenes */
    position: absolute;
    top: 100vh; /* Ajusta la posición desde la parte superior según sea necesario */
    left: 50%;
    transform: translateX(-50%);
    z-index: 1;
}

#galaxy .custom-image-6 {
    background: url('Links/4led.png') no-repeat;
    background-position: center;
    background-size: contain;
    width: 100vw;
    height: 30vh; /* Reducida la altura para dejar espacio para las otras imágenes */
    position: absolute;
    top: 148vh; /* Ajusta la posición desde la parte superior según sea necesario */
    left: 50%; /* Ajusta la posición hacia la izquierda según sea necesario */
    transform: translateX(-50%);
    z-index: 1;
}

#galaxy .custom-image-7 {
    background: url('Links/audioritmicas.png') no-repeat;
    background-position: center;
    background-size: contain;
    width: 100vw;
    height: 50vh; /* Reducida la altura para dejar espacio para las otras imágenes */
    position: absolute;
    top: 195vh; /* Ajusta la posición desde la parte superior según sea necesario */
    left: 50%; /* Ajusta la posición hacia la izquierda según sea necesario */
    transform: translateX(-50%);
    z-index: 1;
}

#galaxy .custom-image-8 {
    background: url('Links/3led.png') no-repeat;
    background-position: center;
    background-size: contain;
    width: 100vw;
    height: 50vh; /* Reducida la altura para dejar espacio para las otras imágenes */
    position: absolute;
    top: 250vh; /* Ajusta la posición desde la parte superior según sea necesario */
    left: 50%; /* Ajusta la posición hacia la izquierda según sea necesario */
    transform: translateX(-50%);
    z-index: 1;
}

#galaxy .custom-image-9 {
    background: url('Links/promobands_desc.png') no-repeat;
    background-position: center;
    background-size: contain;
    width: 100vw;
    height: 50vh; /* Reducida la altura para dejar espacio para las otras imágenes */
    position: absolute;
    top: 300vh; /* Ajusta la posición desde la parte superior según sea necesario */
    left: 50%; /* Ajusta la posición hacia la izquierda según sea necesario */
    transform: translateX(-50%);
    z-index: 1;
}



@font-face {
	font-family: 'Actay';
	src: url('Fonts/ActayWide-BoldItalic.otf') format('opentype'); 
}

.texto {
    font-family: 'Actay', sans-serif;
	background-position: center;
    background-size: contain;
    width: 70vw;
    height: 40vh; /* Reducida la altura para dejar espacio para las otras imágenes */
    position: absolute;
    top: 171vh; /* Ajusta la posición desde la parte superior según sea necesario */
    left: 50%; /* Ajusta la posición hacia la izquierda según sea necesario */
    transform: translateX(-50%);
    z-index: 1;
	color: white;
	font-size: 1.5vw;  /* Cambiado el tamaño del texto según sea necesario */
    
	text-align: center; /* Alineación horizontal al centro */
   
    align-items: center;
}
.texto-2 {
    font-family: 'Actay', sans-serif;
	background-position: center;
    background-size: contain;
    width: 70vw;
    height: 40vh; /* Reducida la altura para dejar espacio para las otras imágenes */
    position: absolute;
    top: 350vh; /* Ajusta la posición desde la parte superior según sea necesario */
    left: 50%; /* Ajusta la posición hacia la izquierda según sea necesario */
    transform: translateX(-50%);
    z-index: 1;
	color: white;
	font-size: 1.5vw;  /* Cambiado el tamaño del texto según sea necesario */
    
	text-align: center; /* Alineación horizontal al centro */
   
    align-items: center;
}
    /* Agrega otros estilos según tus necesidades */


	
@media only screen and (max-width: 767px) {
	.texto {
		font-size: 4vw; 
	}
	.texto-2{
		font-size: 4vw;
	}
	#galaxy .bg {
		background: url('Links/fondo.png'); 
		background-size: cover;
		width: 100%;
		height: 400vh;
		position: absolute;
		top: 0;
		left: 0;
		z-index: -1;
	}
	}