* {
		margin: 0;
		padding: 0;
	}

	:root {
		/* Colores Sólidos */
		--primary-blue: #0066FF;
		--dark-navy: #011627;
		--text-main: #1A1A1A;
		--text-secondary: #4A5568;
		--bg-light: #F8F9FA;

		/* Gradientes */
		--gradient-tech: linear-gradient(135deg, #0066FF 0%, #00CCFF 100%);
		--gradient-dark: linear-gradient(180deg, #011627 0%, #0A192F 100%);
		--gradient-glass: linear-gradient(135deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.05));
	}

	body {
		font-family: 'Poppins', sans-serif;
		font-size: 16px;
	}

	h3 {
		font-family: 'Montserrat', sans-serif;
		font-weight: 400;
		font-style: normal;
	}

	header {
		background: #ed1c24;
		border-bottom: 4px #242424 solid;
		position: fixed;
		width: 100%;
		z-index: 10;
	}
	.borde{
		border-radius: 1rem;
		border: 1px solid #4A5568;
		background: #F8F9FA;
	}
	.logoExpansion {
		height: 25px;
		margin: 0.5rem 0rem;
	}

	.row {
		margin-right: 0px;
		margin-left: 0px;
	}

	/*Header*/
	.oper {
		background-image: url(../img/new/FONDO_TITULO.jpg);
		background-attachment: fixed;
		-webkit-background-size: cover;
		background-size: 100% auto;
		background-repeat: no-repeat;
		background-position: top;
		max-height: 700px;
		width: 80%;
		margin: 0 auto;
		overflow: hidden;
	}

	.tit1 {
		text-align: center;
		font-family: montserrat, sans-serif;
		font-weight: 700;
		font-style: normal;
		font-size: 5vw;
		padding: 15% 0px 10% 0px;
		color: #fff;
		text-shadow: 0px 0px 20px #000;
		text-transform: uppercase;
	}

	/*Header*/

	/*zoom*/
	.img-hover-zoom {
		height: 400px;
		/* [1.1] Set it as per your need */
		overflow: hidden;
		/* [1.2] Hide the overflowing of child elements */
	}

	/* [2] Transition property for smooth transformation of images */
	.img-hover-zoom img {
		transition: transform .5s ease;
	}

	/* [3] Finally, transforming the image when container gets hovered */
	.img-hover-zoom:hover img {
		transform: scale(1.3);
	}

	/*zoom*/
	/*video*/
	/* Start: Video Responsive */
	.video-responsive {
		overflow: hidden;
		padding-bottom: 400px;
		/* Adecua este valor para controlar la altura del video */
		position: relative;
		height: 0;
	}

	.video-responsive iframe {
		left: 0;
		top: 0;
		height: 100%;
		width: 100%;
		position: absolute;
	}

	.nota {
		font-size: 0.9rem;
	}

	/* End: Video Responsive */

	/*Video*/


	.presentado {
		color: #2EA3F2;
	}

	.presentado:hover {
		color: #2EA3F2;
	}

	.fondo {
		background: var(--gradient-dark);
		color: #fff;
	}

	.fondo1 {
		background: var(--gradient-tech);
		border-radius: 10px;
		color: #fff;
	}

	.fondo2 {
		background: #2986b2;
		color: #fff;
		border: 1px #fff solid;
	}

	.fondo3 {
		background: #1A1E27;
		color: #fff;
		border: 1px #fff solid;
	}

	video {
		width: 100%;
	}

	footer {
		background: #333;
	}

	img.conoce {
		height: 40px;
		margin: 1.5rem;
	}

	.container-fluid {
		padding-right: 0px;
		padding-left: 0px;
	}

	.san {
		width: 100%;
	}

	hr.verde {
		background: #ed1c24;
		height: 5px;
		width: 80px;
	}

	hr.naranja {
		background: #ed1c24;
		height: 5px;
		width: 80px;
	}

	/*--------Flip card------------*/


	.outer {
		display: table;
		position: absolute;
		top: 0;
		left: 0;
		height: 100%;
		width: 100%;
	}

	.middle {
		display: table-cell;
		vertical-align: middle;
	}

	.inner {
		margin-left: auto;
		margin-right: auto;
		width: 100%;
		/* Whatever width you want */
	}

	.flip-card {
		margin: auto;
		padding: 10px;
		background-color: transparent;
		-webkit-perspective: 1000px;
		perspective: 1000px;
		width: 100%;
		max-width: 400px;
		aspect-ratio: 1 / 1;
	}

	.flip-card-inner {
		position: relative;
		width: 100%;
		height: 100%;
		text-align: left;
		-webkit-transition: -webkit-transform 0.6s;
		transition: transform 0.6s;
		-webkit-transform-style: preserve-3d;
		transform-style: preserve-3d;
	}

	.flip-card:hover .flip-card-inner {
		transform: rotateY(180deg);
	}

	.flip-card-front,
	.flip-card-back {
		position: absolute;
		width: 100%;
		height: 100%;
		-webkit-backface-visibility: hidden;
		backface-visibility: hidden;
		border-radius: 15px;
		padding: 2rem;
		border: 1px solid rgba(255, 255, 255, 0.1);
		display: flex;
		flex-direction: column;
		justify-content: center;
		background-color: #162133;
	}

	.flip-card-front {
		background-color: #162133;
		color: white;
	}

	.flip-card-back {
		background-color: #1c2b44;
		color: white;
		transform: rotateY(180deg);
	}

	.card-badge {
		background: rgba(35, 66, 125, 0.4);
		color: #8bb6f5;
		font-size: 0.7rem;
		font-weight: 700;
		padding: 4px 12px;
		border-radius: 20px;
		width: fit-content;
		margin-bottom: 1.5rem;
		text-transform: uppercase;
		border: 1px solid rgba(139, 182, 245, 0.3);
	}

	.card-title {
		font-family: 'Montserrat', sans-serif;
		font-size: 2rem;
		font-weight: 700;
		margin-bottom: 0.5rem;
		line-height: 1.2;
	}

	.card-subtitle {
		font-size: 1.1rem;
		font-weight: 400;
		opacity: 0.9;
		margin-bottom: 1.5rem;
	}

	.card-text {
		font-size: 0.9rem;
		line-height: 1.6;
		opacity: 0.7;
	}

	.espacio {
		padding: 0px;
	}


	/*Carusel*/
	.carousel-caption {
		position: relative;
		right: 0%;
		bottom: 0px;
		left: 0%;
		z-index: 10;
		padding-top: 20px;
		padding-bottom: 20px;
		padding-left: 10px;
		padding-right: 10px;
		color: #fff;
		text-align: center;
		background: #17234d;
	}

	.botton {
		display: block;
		width: fit-content;
		margin: 2rem auto 0 auto;
		background: var(--gradient-tech);
		color: #fff;
		padding: 1rem 2.5rem;
		border-radius: 50px;
		font-family: 'Montserrat', sans-serif;
		font-weight: 700;
		text-transform: uppercase;
		font-size: 0.9rem;
		letter-spacing: 1px;
		text-decoration: none;
		transition: all 0.3s ease;
		box-shadow: 0 4px 15px rgba(0, 102, 255, 0.3);
		border: none;
	}

	.botton:hover {
		color: #fff;
		text-decoration: none;
		transform: translateY(-3px);
		box-shadow: 0 8px 25px rgba(0, 102, 255, 0.5);
	}

	.botton:active {
		transform: translateY(-1px);
	}

	@media only screen and (max-width: 1800px) {

		.tit1 {

			font-size: 4vw;
			padding: 18% 0px 20% 0px;

		}

	}

	@media only screen and (max-width: 1024px) {

		.flip-card {
			width: 18rem;
			height: 18rem;
		}

	}

	@media only screen and (max-width: 991px) {

		.flip-card {
			width: 19rem;
			height: 19rem;
		}

	}

	@media only screen and (max-width: 768px) {
		.flip-card {
			width: 100%;
			max-width: 400px;
		}
	}

	@media only screen and (max-width: 600px) {
		.oper {
			background-image: url(../img/aimex-5.jpg);
			max-height: 500px;
		}

		.tit1 {
			font-size: 1.8rem;
			padding: 40% 1rem 20% 1rem;
		}

		.espacio {
			padding: 0px;
		}

		h1 {
			font-size: 1.5rem;
		}

		.flip-card {
			width: 100%;
			max-width: 100%;
			margin-bottom: 2rem;
		}

		.bajada {
			font-size: 1.1rem;
		}

		.card-title {
			font-size: 1.5rem;
		}

		.card-badge {
			margin-bottom: 1rem;
		}

		.flip-card-front,
		.flip-card-back {
			padding: 1.5rem;
		}
	}

	.cuadro {
		width: 100%;
		max-width: 1200px;
		margin: 2rem auto;
		border-radius: 0;
		overflow: hidden;
	}

	@media only screen and (max-width: 600px) {
		.cuadro {
			width: calc(100% - 2rem);
			margin: 1rem auto;
			border-radius: 10px;
		}
	}

	.cuadro img {
		display: block;
		width: 100%;
		height: auto;
	}