@charset "utf-8";
/* CSS Document */

/* X-Small devices (portrait phones, less than 576px) */
/* No media query for `xs` since this is the default in Bootstrap */
body {
    background: white;
	font-family: "monospace",sans-serif!important;
}
h1 {
    font-family: monospace;
    font-size: 2em!important;
}
h2 {
    font-family: monospace;
    font-size: 1.8em !important;
}
span.texto {
    text-align: left;
}

/* Small devices (landscape phones, 340px and up) */
@media (min-width: 340px) {
	body {
    background: white!important;
}
	
.video-intro {
        border-radius: 115% 0%;
        transform: scale(0.4);
        padding: 0px;
        margin-top: -145px;
        margin-left: auto;
        margin-right: auto;
        margin-bottom: -170px;
        transition: all 2s ease; /* Simplificado y corregido */
	 border: 1px white solid;
    }
    .video-intro:active {
        border-radius: 0% 0%; /* Cambio en border-radius al hacer hover */
    }

    .embed-responsive.embed-responsive-16by9 {
        width: 100% !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        height: 100% !important;
        padding: 26px;
        margin-top: -70px;
    }
		.logo{
	width: 210px;
    margin-left: auto;
    margin-right: auto;
	}
	.txt-logo{    font-size: 12px;
    font-family: monospace;
}
}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {
    /* Añade aquí tus estilos específicos para dispositivos medianos */
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {
    /* Añade aquí tus estilos específicos para dispositivos grandes */
}

/* X-Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
	.logo{
	width: 200px;
    margin-left: auto;
    margin-right: auto;
	}
    .video-intro {
		
        border: 1px white solid;
        width: 457px;
        height: 426px;
        border-radius: 115% 0%;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 0px;
		margin-top: 0px;
        transform: scale(0.8);
        transition: all 2s ease; /* Simplificado y corregido */
    }

    .video-intro:hover {
        border-radius: 0% 0%; /* Cambio en border-radius al hacer hover */
    }

    .embed-responsive.embed-responsive-16by9 {
        width: 100% !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        height: 100% !important;
        padding: 26px;
        margin: 0px !important;
    }
	.txt-logo{    font-size: 12px;
    font-family: monospace;
}
}

/* XX-Large devices (larger desktops, 1400px and up) */
@media (min-width: 1400px) {
    /* Añade aquí tus estilos específicos para dispositivos extra grandes */
}