body { 
	/* font-family: monospace;  */
	background: white;
	margin-top: 69px; /* Ajusta este valor según la altura de tu header */
}

.navbar {
	background: #002761b2;
	border-radius: 0px 0px 16px 16px;
	box-shadow: 0 4px 50px rgba(0, 0, 0, 0.1);
	backdrop-filter: blur(7.1px);
	-webkit-backdrop-filter: blur(7.1px);
	border: 1px solid rgba(255, 255, 255, 0.08);
	border: 1px solid rgba(255, 255, 255, 0.12);	
	border: none;
	height: 95px;
}

.subtitle {
	font-size: 16px;
}

.contenedor_respuesta {
	margin: auto;
	display: table;
}

.contenedor_respuesta p { 
	background: white;
	color: black;
	font-size: 22px;
	/* font-family:'Amaranth', sans-serif; */
}
.contenedor_respuesta li { 
	background: white;
	color: black;
	font-size: 20px;
	/* font-family:'Amaranth', sans-serif; */
}

.lm-copyRight {
	text-align: center;
	background-color: #2d268c;
	line-height: 40px;
	width: 100%;
	padding: 30px 20px;
	font-size: 16px;
	font-weight: 400;
	color: #efefef;
}


.square {
	background: #ddd;
	width: 10px;
	height: 10px;
	position: absolute;
	top: 50%;
	left: 50%;
	margin-top: -5px;
	margin-left: -5px;
}

#sq1 {
	margin-top: -25px;
	margin-left: -25px;
	animation: loader_5191 675ms ease-in-out 0s infinite alternate;
}

#sq2 {
	margin-top: -25px;
	animation: loader_5191 675ms ease-in-out 75ms infinite alternate;
}

#sq3 {
	margin-top: -25px;
	margin-left: 15px;
	animation: loader_5191 675ms ease-in-out 150ms infinite;
}

#sq4 {
	margin-left: -25px;
	animation: loader_5191 675ms ease-in-out 225ms infinite;
}

#sq5 {
	animation: loader_5191 675ms ease-in-out 300ms infinite;
}

#sq6 {
	margin-left: 15px;
	animation: loader_5191 675ms ease-in-out 375ms infinite;
}

#sq7 {
	margin-top: 15px;
	margin-left: -25px;
	animation: loader_5191 675ms ease-in-out 450ms infinite;
}

#sq8 {
	margin-top: 15px;
	animation: loader_5191 675ms ease-in-out 525ms infinite;
}

#sq9 {
	margin-top: 15px;
	margin-left: 15px;
	animation: loader_5191 675ms ease-in-out 600ms infinite;
}

.wrapper {
	--font-color-dark: #323232;
	--font-color-light: #efefef;
	--bg-color: #fff;
	--main-color: #1f3391;
	--secondary-color: #1f3391a8;
	--accent-color: #e4051e;
	position: relative;
	width: 100%;
	height: 36px;
	display: flex;
	flex-direction: row;
	justify-content: center;
	gap: 15px;
	
}

.option {
	margin-right: 5px;
	width: 100px;
	height: 28px;
	position: relative;
	top: 2px;
	left: 2px;
	transition: 0.25s cubic-bezier(0, 0, 0, 1);
	font-size: 18px;
}

.option:last-child {
	margin-right: 4px;
}


.option:hover .span {
	color: #ff6400;
}

.input {
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	appearance: none;
	cursor: pointer;
}


.btn-radio {
	width: 100%;
	height: 100%;
	border-radius: 50px;
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 10px;
}

.span {
	color: var(--font-color-light);
}

.input:checked + .btn-radio {
	transition: 0.2s cubic-bezier(0, 0, 0, 1);
}

.input:checked + .btn-radio .span {
	color: #efefef;
	transition: 0.25s cubic-bezier(0, 0, 0, 1);
}

.input:checked + .btn-radio .radio-background {
	display: flex;
}

.radio-background {
	width: 100%;
	height: 100%;
	display: none;
}

.loader-container {
	width: 100%;
	height: 200px;
	display: none;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	padding: 50px;
	gap: 10px;
}

.pl {
	width: 6em;
	height: 6em;
}

.pl__ring {
	animation: ringA 2s linear infinite;
}

.pl__ring--a {
	stroke: #eab703;
}

.pl__ring--b {
	animation-name: ringB;
	stroke: #2a2b28;
}

.pl__ring--c {
	animation-name: ringC;
	stroke: #f49725;
}

.pl__ring--d {
	animation-name: ringD;
	stroke: #717171;
}



@keyframes ringA {
	from, 4% {
	stroke-dasharray: 0 660;
	stroke-width: 20;
	stroke-dashoffset: -330;
	}

	12% {
	stroke-dasharray: 60 600;
	stroke-width: 30;
	stroke-dashoffset: -335;
	}

	32% {
	stroke-dasharray: 60 600;
	stroke-width: 30;
	stroke-dashoffset: -595;
	}

	40%, 54% {
	stroke-dasharray: 0 660;
	stroke-width: 20;
	stroke-dashoffset: -660;
	}

	62% {
	stroke-dasharray: 60 600;
	stroke-width: 30;
	stroke-dashoffset: -665;
	}

	82% {
	stroke-dasharray: 60 600;
	stroke-width: 30;
	stroke-dashoffset: -925;
	}

	90%, to {
	stroke-dasharray: 0 660;
	stroke-width: 20;
	stroke-dashoffset: -990;
	}
}

@keyframes ringB {
	from, 12% {
	stroke-dasharray: 0 220;
	stroke-width: 20;
	stroke-dashoffset: -110;
	}

	20% {
	stroke-dasharray: 20 200;
	stroke-width: 30;
	stroke-dashoffset: -115;
	}

	40% {
	stroke-dasharray: 20 200;
	stroke-width: 30;
	stroke-dashoffset: -195;
	}

	48%, 62% {
	stroke-dasharray: 0 220;
	stroke-width: 20;
	stroke-dashoffset: -220;
	}

	70% {
	stroke-dasharray: 20 200;
	stroke-width: 30;
	stroke-dashoffset: -225;
	}

	90% {
	stroke-dasharray: 20 200;
	stroke-width: 30;
	stroke-dashoffset: -305;
	}

	98%, to {
	stroke-dasharray: 0 220;
	stroke-width: 20;
	stroke-dashoffset: -330;
	}
}

@keyframes ringC {
	from {
	stroke-dasharray: 0 440;
	stroke-width: 20;
	stroke-dashoffset: 0;
	}

	8% {
	stroke-dasharray: 40 400;
	stroke-width: 30;
	stroke-dashoffset: -5;
	}

	28% {
	stroke-dasharray: 40 400;
	stroke-width: 30;
	stroke-dashoffset: -175;
	}

	36%, 58% {
	stroke-dasharray: 0 440;
	stroke-width: 20;
	stroke-dashoffset: -220;
	}

	66% {
	stroke-dasharray: 40 400;
	stroke-width: 30;
	stroke-dashoffset: -225;
	}

	86% {
	stroke-dasharray: 40 400;
	stroke-width: 30;
	stroke-dashoffset: -395;
	}

	94%, to {
	stroke-dasharray: 0 440;
	stroke-width: 20;
	stroke-dashoffset: -440;
	}
}

@keyframes ringD {
	from, 8% {
	stroke-dasharray: 0 440;
	stroke-width: 20;
	stroke-dashoffset: 0;
	}

	16% {
	stroke-dasharray: 40 400;
	stroke-width: 30;
	stroke-dashoffset: -5;
	}

	36% {
	stroke-dasharray: 40 400;
	stroke-width: 30;
	stroke-dashoffset: -175;
	}

	44%, 50% {
	stroke-dasharray: 0 440;
	stroke-width: 20;
	stroke-dashoffset: -220;
	}

	58% {
	stroke-dasharray: 40 400;
	stroke-width: 30;
	stroke-dashoffset: -225;
	}

	78% {
	stroke-dasharray: 40 400;
	stroke-width: 30;
	stroke-dashoffset: -395;
	}

	86%, to {
	stroke-dasharray: 0 440;
	stroke-width: 20;
	stroke-dashoffset: -440;
	}
}


@keyframes loader_5191 {
	from {
	opacity: 0;
	}

	to {
	opacity: 1;
	}
}

.d-flex {
	display: flex;
	flex-direction: row;
	gap: 10px;
}

.navbar-brand {
    margin-right: 0 !important; /* Anula el margen derecho definido por Bootstrap */
	display: flex;
	flex-direction: row;
	justify-content: center;
	width: 100%;
}

@media (max-width: 768px) {

    #mainNav {
        padding: 0 0px; /* Reducir el espacio disponible para la barra de navegación */
    }

	.d-flex {
		display: none !important;
	}
	
	.container-fluid {
		width: 100%;
		align-items: center;
		justify-content: center !important;
	}

    .logo {
        height: 20px; /* Reducir el tamaño en pantallas más pequeñas */
        margin: 0 0px; /* Reducir el espacio entre logotipos */
		margin-right: 0px;
    }

	.lm-copyRight {
		display: flex;
		text-align: center;
		background-color: #2d268c;
		line-height: 40px;
		width: 100%;
		padding: 30px 20px;
		font-size: 16px;
		font-weight: 400;
		color: #efefef;
	}

}