/* Minification failed. Returning unminified contents.
(12,26): run-time error CSS1039: Token not allowed after unary operator: '-azul'
(13,15): run-time error CSS1039: Token not allowed after unary operator: '-blanco'
(14,26): run-time error CSS1039: Token not allowed after unary operator: '-azul'
(40,43): run-time error CSS1039: Token not allowed after unary operator: '-grisClaro'
(40,81): run-time error CSS1039: Token not allowed after unary operator: '-grisClaro'
(41,40): run-time error CSS1039: Token not allowed after unary operator: '-blanco'
(41,64): run-time error CSS1039: Token not allowed after unary operator: '-azul'
(42,49): run-time error CSS1039: Token not allowed after unary operator: '-grisClaro'
(42,76): run-time error CSS1039: Token not allowed after unary operator: '-blanco'
(98,33): run-time error CSS1039: Token not allowed after unary operator: '-negro'
(105,15): run-time error CSS1039: Token not allowed after unary operator: '-grisLetras'
(120,26): run-time error CSS1039: Token not allowed after unary operator: '-negro'
(121,26): run-time error CSS1039: Token not allowed after unary operator: '-negro'
(124,15): run-time error CSS1039: Token not allowed after unary operator: '-blanco'
(144,26): run-time error CSS1039: Token not allowed after unary operator: '-blanco'
(154,15): run-time error CSS1039: Token not allowed after unary operator: '-negro'
(166,15): run-time error CSS1039: Token not allowed after unary operator: '-blanco'
(169,29): run-time error CSS1039: Token not allowed after unary operator: '-blanco'
(179,26): run-time error CSS1039: Token not allowed after unary operator: '-negro'
(191,26): run-time error CSS1039: Token not allowed after unary operator: '-azul'
(192,15): run-time error CSS1039: Token not allowed after unary operator: '-blanco'
(193,26): run-time error CSS1039: Token not allowed after unary operator: '-blanco'
(212,26): run-time error CSS1039: Token not allowed after unary operator: '-blanco'
(217,15): run-time error CSS1039: Token not allowed after unary operator: '-negro'
(229,1): run-time error CSS1019: Unexpected token, found '@import'
(229,9): run-time error CSS1019: Unexpected token, found 'url('colores.css?v=1')'
(230,1): run-time error CSS1019: Unexpected token, found '@import'
(230,9): run-time error CSS1019: Unexpected token, found 'url('general.css?v=1')'
(231,1): run-time error CSS1019: Unexpected token, found '@import'
(231,9): run-time error CSS1019: Unexpected token, found 'url('segundaVersion.css?v=1')'
(232,1): run-time error CSS1019: Unexpected token, found '@import'
(232,9): run-time error CSS1019: Unexpected token, found 'url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@300&family=Oswald:wght@300;500;700&display=swap')'
(252,26): run-time error CSS1039: Token not allowed after unary operator: '-blanco'
(255,32): run-time error CSS1039: Token not allowed after unary operator: '-grisLetras'
(266,42): run-time error CSS1039: Token not allowed after unary operator: '-blanco'
(269,26): run-time error CSS1039: Token not allowed after unary operator: '-azul'
(270,15): run-time error CSS1039: Token not allowed after unary operator: '-blanco'
(279,15): run-time error CSS1039: Token not allowed after unary operator: '-blanco'
(295,47): run-time error CSS1039: Token not allowed after unary operator: '-blanco'
(299,26): run-time error CSS1039: Token not allowed after unary operator: '-azul'
(305,53): run-time error CSS1039: Token not allowed after unary operator: '-azulInput'
(306,52): run-time error CSS1039: Token not allowed after unary operator: '-azul'
(315,1): run-time error CSS1019: Unexpected token, found '@-webkit-keyframes'
(316,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '0%'
(319,1): run-time error CSS1019: Unexpected token, found '@keyframes'
(320,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '0%'
(348,26): run-time error CSS1039: Token not allowed after unary operator: '-azulInput'
(352,51): run-time error CSS1039: Token not allowed after unary operator: '-blanco'
(352,93): run-time error CSS1039: Token not allowed after unary operator: '-blanco'
(354,15): run-time error CSS1039: Token not allowed after unary operator: '-blanco'
(365,30): run-time error CSS1039: Token not allowed after unary operator: '-verde'
(366,30): run-time error CSS1039: Token not allowed after unary operator: '-rosa'
(367,1): run-time error CSS1019: Unexpected token, found '@-webkit-keyframes'
(368,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '50%'
(371,1): run-time error CSS1019: Unexpected token, found '@keyframes'
(372,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '50%'
(390,29): run-time error CSS1039: Token not allowed after unary operator: '-azul'
(396,15): run-time error CSS1039: Token not allowed after unary operator: '-azul'
(403,26): run-time error CSS1039: Token not allowed after unary operator: '-azul'
(409,29): run-time error CSS1039: Token not allowed after unary operator: '-blanco'
(416,26): run-time error CSS1039: Token not allowed after unary operator: '-blanco'
(419,31): run-time error CSS1039: Token not allowed after unary operator: '-azul'
(443,15): run-time error CSS1039: Token not allowed after unary operator: '-grisLetras'
(447,89): run-time error CSS1039: Token not allowed after unary operator: '-azul'
(454,26): run-time error CSS1039: Token not allowed after unary operator: '-grisLetras'
(455,15): run-time error CSS1039: Token not allowed after unary operator: '-blanco'
(461,71): run-time error CSS1039: Token not allowed after unary operator: '-azul'
(471,16): run-time error CSS1039: Token not allowed after unary operator: '-grisLetras'
(485,26): run-time error CSS1039: Token not allowed after unary operator: '-grisLetras'
(498,26): run-time error CSS1039: Token not allowed after unary operator: '-azul'
(504,66): run-time error CSS1039: Token not allowed after unary operator: '-azul'
(511,33): run-time error CSS1039: Token not allowed after unary operator: '-grisClaro'
(518,26): run-time error CSS1039: Token not allowed after unary operator: '-azulInput'
(546,26): run-time error CSS1039: Token not allowed after unary operator: '-azulInput'
(552,26): run-time error CSS1039: Token not allowed after unary operator: '-azulInput'
(564,26): run-time error CSS1039: Token not allowed after unary operator: '-azulInput'
(629,1): run-time error CSS1019: Unexpected token, found '@keyframes'
(630,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '0%'
(634,1): run-time error CSS1019: Unexpected token, found '@keyframes'
(635,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '0%'
(639,1): run-time error CSS1019: Unexpected token, found '@keyframes'
(640,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '0%'
(644,1): run-time error CSS1019: Unexpected token, found '@keyframes'
(645,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '0%'
(649,1): run-time error CSS1019: Unexpected token, found '@keyframes'
(650,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '0%'
(654,1): run-time error CSS1019: Unexpected token, found '@keyframes'
(655,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '0%'
(659,1): run-time error CSS1019: Unexpected token, found '@keyframes'
(660,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '0%'
(664,1): run-time error CSS1019: Unexpected token, found '@keyframes'
(665,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '0%'
(669,1): run-time error CSS1019: Unexpected token, found '@keyframes'
(670,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '0%'
(678,15): run-time error CSS1039: Token not allowed after unary operator: '-azul'
(684,50): run-time error CSS1039: Token not allowed after unary operator: '-grisLetras'
(686,15): run-time error CSS1039: Token not allowed after unary operator: '-azul'
(690,32): run-time error CSS1039: Token not allowed after unary operator: '-grisLetras'
(691,30): run-time error CSS1039: Token not allowed after unary operator: '-azul'
(701,33): run-time error CSS1039: Token not allowed after unary operator: '-azul'
(703,15): run-time error CSS1039: Token not allowed after unary operator: '-grisLetras'
(707,41): run-time error CSS1039: Token not allowed after unary operator: '-azul'
(716,15): run-time error CSS1039: Token not allowed after unary operator: '-azul'
(718,56): run-time error CSS1039: Token not allowed after unary operator: '-azul'
(718,78): run-time error CSS1039: Token not allowed after unary operator: '-grisClaro'
(719,49): run-time error CSS1039: Token not allowed after unary operator: '-blanco'
(720,51): run-time error CSS1039: Token not allowed after unary operator: '-blanco'
(721,28): run-time error CSS1039: Token not allowed after unary operator: '-azul'
(728,26): run-time error CSS1039: Token not allowed after unary operator: '-azul'
(729,15): run-time error CSS1039: Token not allowed after unary operator: '-azul'
(739,45): run-time error CSS1039: Token not allowed after unary operator: '-azul'
(739,67): run-time error CSS1039: Token not allowed after unary operator: '-blanco'
(740,61): run-time error CSS1039: Token not allowed after unary operator: '-grisClaro'
(745,70): run-time error CSS1039: Token not allowed after unary operator: '-azulInput'
 */
a { text-decoration: none; cursor: pointer; }
.principal {
	width: 1200px;
	max-width: 100%;
	margin: 0 auto;
	padding: 0 10px;
	box-sizing: border-box;
}
.boton {
	transition: all 0.4s;
	box-sizing: border-box;
	background-color: var( --azul );
	color: var( --blanco );
	border: 1px solid var( --azul );
	text-align: center;
	cursor: pointer;
	text-transform: uppercase;
	outline: none;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	padding: 12px 5px;
	display: block;
	width: auto;
	border-radius: 12px;
	outline: none;
	box-shadow: none;
	margin: 15px 0;
	-webkit-box-shadow: none;
	-webkit-touch-callout: none;
	
}
.boton:focus, a:focus {
	outline: 0;
	box-shadow: none;
	-webkit-box-shadow: none;
	-webkit-touch-callout: none;
	-webkit-tap-highlight-color: rgba(0,0,0,0);
}
.boton.disabled { background-color: var( --grisClaro ); border: 1px solid var( --grisClaro ); }
.boton:hover { background-color: var( --blanco ); color: var( --azul ); }
.boton.disabled:hover { background-color: var( --grisClaro ); color: var( --blanco ); }
.vacio { background: #FFE9EA !important; border: 1px solid #ff0000 !important; }
.hide { display: none; }
.fila {
	zoom: 1;
	width: 100%;
	box-sizing: border-box;
}
.fila:before, .fila:after {
	content: '';
	display: table;
}
.fila:after {
	clear: both;
}
.cinco { width: 5%; float: left; box-sizing: border-box; }
.diez { width: 10%; float: left; box-sizing: border-box; }
.diezSeisSesentaSeis { width: 16.66%; float: left; box-sizing: border-box; }
.diezOcho { width: 18%; float: left; box-sizing: border-box; }
.diezSeis { width: 16.6%; float: left; box-sizing: border-box; }
.quince { width: 15%; float: left; box-sizing: border-box; }
.veinte { width: 20%; float: left; box-sizing: border-box; }
.veinteTres { width: 23.3%; float: left; box-sizing: border-box; }
.veinteCinco { width: 25%; float: left; box-sizing: border-box; }
.treinta { width: 30%; float: left; box-sizing: border-box; }
.treintaTres { width: 33.3%; float: left; box-sizing: border-box; }
.treintaCinco { width: 35%; float: left; box-sizing: border-box; }
.cuarenta { width: 40%; float: left; box-sizing: border-box; }
.cuarentaCinco { width: 45%; float: left; box-sizing: border-box; }
.cincuenta { width: 50%; float: left; box-sizing: border-box; }
.cincuentaCinco { width: 55%; float: left; box-sizing: border-box; }
.sesenta { width: 60%; float: left; box-sizing: border-box; }
.sesentaCuatro { width: 64%; float: left; box-sizing: border-box; }
.sesentaSeis { width: 66.6%; float: left; box-sizing: border-box; }
.setenta { width: 70%; float: left; box-sizing: border-box; }
.setentaCinco { width: 75%; float: left; box-sizing: border-box; }
.ochenta { width: 80%; float: left; box-sizing: border-box; }
.noventa { width: 90%; float: left; box-sizing: border-box; }
.cPad { padding: 8px; }
.cPadBig { padding: 15px; }
.full { width: 100%; box-sizing: border-box; }
.tCenter { text-align: center !important; }
.tRight { text-align: right; }
.tLeft { text-align: left; }
.tJustify { text-align: justify; }
.fullImg { width: 100%; height: auto; }
.cPointer { cursor: pointer; }
.centraVertical { display: table; }
.centraVertical .centrado { display: table-cell; vertical-align: middle; width: 100%; }
input, textarea, select {
	padding: 5px;
	font-size: 16px;
	box-sizing: border-box;
	width: 100%;
	background-color: transparent;
	border: none;
	border-bottom: 1px solid var( --negro );
	outline: none;
	box-shadow: none;
}
input[type="radio"] { width: 20px; height: 20px; }
textarea { min-height: 150px; }
::-webkit-input-placeholder {
	color: var( --grisLetras );
}
input:required, input:invalid { box-shadow: none; }
input[type="checkbox"] {
	width: 30px;
	padding: 0;
}
.mTop { margin-top: 30px; }
.sociales a {
	text-align: center;
	display: inline-block;
	border-radius: 100%;
	position: relative;
	width: 35px;
	height: 35px;
	background-color: var( --negro );
	border: 1px solid var( --negro );
}
.sociales a i {
	color: var( --blanco );
	font-size: 20px;
	margin: 7px 3px;
	position: relative;
	z-index: 1;
}
.sociales a span {
	border-radius: 0;
	display: block;
	height: 0;
	left: 50%;
	margin: 0;
	position: absolute;
	top: 50%;
	transition: all 0.3s;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	-ms-transition: all 0.3s;
	-o-transition: all 0.3s;
	width: 0;
	background-color: var( --blanco );
}
.sociales a:hover span {
	width: 100%;
	height: 100%;
	border-radius: 100%;
	top: 0;
	left: 0;
}
.sociales a:hover i {
	color: var( --negro );
}
img { max-width: 100%; }
.cargando {
	z-index: 9999999;
	position: fixed;
	width: 100%;
	text-align: center;
	top: 40%;
	left: 0;
	display: none;
	text-align: center;
	color: var( --blanco );
}
.cargando i { font-size: 65px; }
.cargando h3 { color: var( --blanco ); }
.capaNegra {
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	z-index: 100;
	background-color: var( --negro );
	opacity: 0.7;
	display: none;
}
.vuelveTop {
	position: fixed;
	right: 20px;
	bottom: 50px;
	border-radius: 50%;
	height: 50px;
	width: 50px;
	text-align: center;
	background-color: var( --azul );
	color: var( --blanco );
	border: 1px solid var( --blanco );
	box-sizing: border-box;
	padding: 10px;
	font-size: 20px;
	display: none;
	z-index: 99999;
}
.popup {
	position: fixed;
	width: 500px;
	max-width: 90%;
	z-index: 10002;
	padding: 20px;
	margin: 0 auto;
	left: 0;
	right: 0;
	top: -1000px;
	transition: all 0.5s;
	box-sizing: border-box;
	background-color: var( --blanco );
}
.popup .cierra {
	z-index: 1;
	cursor: pointer;
	color: var( --negro );
	font-size: 20px;
	position: absolute;
	right: 20px;
}
.popup.popupActivo {
	top: 50%;
	transform: translateY(-55%);
}
.d-none {
	display: none;
}
@import url( 'colores.css?v=1' );
@import url( 'general.css?v=1' );
@import url( 'segundaVersion.css?v=1' );
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@300&family=Oswald:wght@300;500;700&display=swap');
body {
	margin: 0;
	font-family: 'Open Sans', sans-serif;
}
a {
	text-decoration: none;
	outline: none;
	user-select: none;
	box-shadow: none;
	-webkit-tap-highlight-color: rgba(0,0,0,0);
}
.logo { width: 300px; height: auto; max-width: 80%; margin: 0 auto; }
.pagina {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	box-sizing: border-box;
	background-color: var( --blanco );
	transition: all 600ms cubic-bezier(0.190, 1.000, 0.560, 1.000);
	transform: translate3d( 0, -100%, 0 );
	border-right: 1px solid var( --grisLetras );
}
.contenidoPagina {
	opacity: 0;
	will-change: margin-top;
	transition: all 500ms;
	transition-delay: 400ms;
	margin-top: -5%;
}
.pagina.activa { transform: translate3d( 0, 0, 0 ); z-index: 99 !important; }
.pagina.activa .contenidoPagina { opacity: 1; margin-top: 0; }
.pagina.blanca { background-color: var( --blanco ); }
.pagina .cabeza {
	width: 100%;
	background-color: var( --azul );
	color: var( --blanco );
	box-sizing: border-box;
	padding: 5px;
}
.pagina .cabeza h1 { font-size: 16px; text-align: center; }
.pagina .cabeza .icono {
	position: absolute;
	font-size: 25px;
	top: 10px;
	color: var( --blanco );
}
.pagina .cabeza .icono.derecha { right: 8px; }
.pagina .cabeza .icono.izquierda { left: 8px; }
.pagina .cuerpo { box-sizing: border-box; padding: 15px; max-width: 1000px; width: 100%; margin: 0 auto; }
.loader {
	width: 150px;
	text-align: center;
	position: fixed;
	top: 47%;
	left: 0;
	right: 0;
	margin: 0 auto;
	z-index: 101;
	display: none;
}
.loader h1 { text-align: center; color: var( --blanco ); margin: 0; }
.loader > div {
	width: 18px;
	height: 18px;
	background-color: var( --azul );
	border-radius: 100%;
	display: inline-block;
	-webkit-animation: sk-bouncedelay 1.4s infinite ease-in-out both;
	animation: sk-bouncedelay 1.4s infinite ease-in-out both;
}
.loader > div:first-child { background-color: var( --azulInput ); }
.loader > div:last-child { background-color: var( --azul ); }
.loader .bounce1 {
	-webkit-animation-delay: -0.32s;
	animation-delay: -0.32s;
}
.loader .bounce2 {
	-webkit-animation-delay: -0.16s;
	animation-delay: -0.16s;
}
@-webkit-keyframes sk-bouncedelay {
	0%, 80%, 100% { -webkit-transform: scale(0) }
	40% { -webkit-transform: scale(1.0) }
}
@keyframes sk-bouncedelay {
	0%, 80%, 100% {
		-webkit-transform: scale(0);
		transform: scale(0);
	} 40% {
		-webkit-transform: scale(1.0);
		transform: scale(1.0);
	}
}
.centraVertical {
	display: table-cell;
	vertical-align: middle;
	width: 100%;
}
.pagina#login {
	z-index: 1;
	padding: 50px 20px;
	text-align: center;
	background-image: url( '../images/fondo-pago.png' );
	background-repeat: no-repeat !important;
	background-position: top center !important;
	background-attachment: fixed !important;
	background-size: cover !important;
}
.loginForm { margin: 40px 0; max-width: 600px; margin: 0 auto; }
.campoForm {
	width: 100%;
	box-sizing: border-box;
	padding: 15px;
	background-color: var( --azulInput );
	border-radius: 12px;
	margin: 5px 0;
}
.campoForm input { border-bottom: 1px solid var( --blanco ); text-align: left; color: var( --blanco ); -webkit-user-select: all; -ms-user-select: all; user-select: all; z-index: 1; }
.campoForm input::-webkit-input-placeholder {
	color: var( --blanco );
}
.registraLink, .recuerdaLink {
	display: block;
	margin: 8px;
	font-size: 16px;
	outline: none;
	box-shadow: none;
	-webkit-box-shadow: none;
	-webkit-touch-callout: none;
}
.registraLink { color: var( --verde ); }
.recuerdaLink { color: var( --rosa ); }
@-webkit-keyframes push-on-hover {
	50% { -webkit-transform: scale( 0.9 ); transform: scale( 0.9 ); }
	100% { -webkit-transform: scale( 1 ); transform: scale( 1 ); }
}
@keyframes push-on-hover {
	50% { -webkit-transform: scale( 0.9 ); transform: scale( 0.9 ); }
	100% { -webkit-transform: scale( 1 ); transform: scale( 1 ); }
}
.push-on-hover {
	-webkit-transform: perspective( 1px ) translateZ( 0 );
	transform: perspective( 1px ) translateZ( 0 );
	box-shadow: 0 0 1px rgba( 0, 0, 0, 0 );
}
.push-on-hover:hover, .push-on-hover:focus, .push-on-hover:active {
	-webkit-animation-name: push-on-hover;
	animation-name: push-on-hover;
	-webkit-animation-duration: 0.2s;
	animation-duration: 0.2s;
	-webkit-animation-timing-function: linear;
	animation-timing-function: linear;
	-webkit-animation-iteration-count: 1;
	animation-iteration-count: 1;
}
.pagina#home { color: var( --azul ); }
.pagina#home h2, .pagina#home h3 { margin: 0; }
.botonesContiene { margin-top: 30px; }
.botonHome {
	display: block;
	text-align: center;
	color: var( --azul );
	margin-bottom: 20px;
}
.botonHome div {
	width: 70px;
	height: 70px;
	border-radius: 10px;
	background-color: var( --azul );
	box-sizing: border-box;
	padding-top: 10px;
	margin: 0 auto;
	margin-bottom: 5px;
}
.botonHome i { color: var( --blanco ); font-size: 50px; }
.botonHome span { font-size: 12px; }
.menuContainer {
	position: absolute;
	height: 100%;
	right: 0;
	width: 80%;
	background-color: var( --blanco );
	transition: all 500ms;
	z-index: 98;
	border-left: 1px solid var( --azul );
	box-sizing: border-box;
	padding: 20px;
	opacity: 0;
}
.menuContainer.activo { opacity: 1; }
.menuContainer .menuHead {
	width: 100%;
	text-align: center;
	padding: 10px;
	box-sizing: border-box;
}
.menuContainer .menuHead img { width: 120px; height: auto; margin: 0 auto; }
.menuContainer nav ul {
	display: block;
	list-style: none;
	padding: 0;
	margin: 20px 0;
	font-size: 16px;
}
.menuContainer nav ul li { width: 100%; }
.menuContainer nav ul li a {
	box-sizing: border-box;
	padding: 8px 0;
	color: var( --grisLetras );
	transition: all 500ms;
}
.menuContainer nav ul li.activo a, .menuContainer nav ul li.activo a i,
.menuContainer nav ul li:hover > a, .menuContainer nav ul li:hover > a i { color: var( --azul ); }
.menuContainer nav ul li a i { font-size: 30px; margin: 5px; }
.menuContainer nav ul li a .iniciales {
	display: inline-block;
	width: 30px;
	height: 30px;
	border-radius: 100%;
	background-color: var( --grisLetras );
	color: var( --blanco );
	text-align: center;
	box-sizing: border-box;
	padding-top: 5px;
	margin: 5px;
}
.menuContainer nav ul li.activo a .iniciales{ background-color: var( --azul ); }
.moverPagina { transform: translate( -80%, 0 ) !important; }
.aceptaBox input[type="checkbox"] { display: none; }
.aceptaBox input[type="checkbox"] + label {
  display: block;
  position: relative;
  padding-left: 35px;
  padding-top: 3px;
  margin-bottom: 20px;
  font-size: 16px;
  color: var( --grisLetras );
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  outline: none;
  box-shadow: none;
}
.aceptaBox input[type="checkbox"] + label:last-child { margin-bottom: 0; }
.aceptaBox input[type="checkbox"] + label:before {
	content: '';
	display: block;
	width: 20px;
	height: 20px;
	border: 2px solid var( --grisLetras );
	position: absolute;
	left: 0;
	top: 0;
	opacity: .6;
	-webkit-transition: all .12s, border-color .08s;
	transition: all .12s, border-color .08s;
}
.aceptaBox input[type="checkbox"]:checked + label:before {
	width: 10px;
	top: -5px;
	left: 5px;
	opacity: 1;
	border: 2px solid var( --azul );
	border-top-color: transparent;
	border-left-color: transparent;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}
.aceptaBox input[type="checkbox"]:checked + label { color: var( --azul ); }
.radios { list-style-type: none; padding-left: 0; width: 100%; }
.radios li {
	position: relative;
	padding: 10px;
	padding-left: 40px;
	height: 35px;
	border-bottom: 1px solid var( --grisClaro );
}
.radios li:last-child { border: none; }
.radios li label:before {
	content: "";
	width: 15px;
	height: 15px;
	border: 2px solid var( --azulInput );
	position: absolute;
	left: 7px;
	top: calc( 50% - 13px );
	box-sizing: border-box;
	border-radius: 50%;
}
.radios li input[type="radio"] {
	opacity: 0;
	-webkit-appearance: none;
	display: inline-block;
	vertical-align: middle;
	z-index: 100;
	margin: 0;
	padding: 0;
	width: 100%;
	height: 30px;
	position: absolute;
	left: 0;
	top: calc(50% - 15px);
	cursor: pointer;
}
.bullet {
	position: relative;
	width: 25px;
	height: 25px;
	left: -3px;
	top: calc(50% - 23px);
	border: 5px solid var( --azulInput );
	opacity: 0;
	border-radius: 50%;
}
.radios li input[type="radio"]:checked ~ label:before {
	border: none;
	background-color: var( --azulInput );
}
.radios li input[type="radio"]:checked ~ .bullet {
	position:absolute;
	opacity: 1;
	animation-name: explode;
	animation-duration: 0.350s;
}
.line {
	position: absolute;
	width: 10px;
	height: 2px;
	background-color: var( --azulInput );
	opacity: 0;
}
.line.zero {
	left: 11px;
	top: -21px;
	transform: translateY(20px);
	width: 2px;
	height: 10px;
}
.line.one { right: -7px; top: -11px; transform: rotate(-55deg) translate(-9px); }
.line.two { right: -20px; top: 11px; transform: translate(-9px); }
.line.three { right: -8px; top: 35px; transform: rotate(55deg) translate(-9px); }
.line.four { left: -8px; top: -11px; transform: rotate(55deg) translate(9px); }
.line.five { left: -20px; top: 11px; transform: translate(9px); }
.line.six { left: -8px; top: 35px; transform: rotate(-55deg) translate(9px); }
.line.seven { left: 11px; bottom: -21px; transform: translateY(-20px); width: 2px; height: 10px; }
.radios li input[type="radio"]:checked ~ .bullet .line.zero{
	animation-name:drop-zero;
	animation-delay: 0.100s;
	animation-duration: 0.9s;
	animation-fill-mode: forwards;
}
.radios li input[type="radio"]:checked ~ .bullet .line.one{
	animation-name:drop-one;
	animation-delay: 0.100s;
	animation-duration: 0.9s;
	animation-fill-mode: forwards;
}
.radios li input[type="radio"]:checked ~ .bullet .line.two{
	animation-name:drop-two;
	animation-delay: 0.100s;
	animation-duration: 0.9s;
	animation-fill-mode: forwards;
}
.radios li input[type="radio"]:checked ~ .bullet .line.three{
	animation-name:drop-three;
	animation-delay: 0.100s;
	animation-duration: 0.9s;
	animation-fill-mode: forwards;
}
.radios li input[type="radio"]:checked ~ .bullet .line.four{
	animation-name:drop-four;
	animation-delay: 0.100s;
	animation-duration: 0.9s;
	animation-fill-mode: forwards;
}
.radios li input[type="radio"]:checked ~ .bullet .line.five{
	animation-name:drop-five;
	animation-delay: 0.100s;
	animation-duration: 0.9s;
	animation-fill-mode: forwards;
}
.radios li input[type="radio"]:checked ~ .bullet .line.six{
	animation-name:drop-six;
	animation-delay: 0.100s;
	animation-duration: 0.9s;
	animation-fill-mode: forwards;
}
.radios li input[type="radio"]:checked ~ .bullet .line.seven{
	animation-name:drop-seven;
	animation-delay: 0.100s;
	animation-duration: 0.9s;
	animation-fill-mode: forwards;
}
@keyframes explode {
	0%{ opacity: 0; transform: scale(10); }
	60%{ opacity: 1; transform: scale(0.5); }
	100% { opacity: 1; transform: scale(1); }
}
@keyframes drop-zero {
	0% { opacity: 0; transform: translateY(20px); height: 10px; }
	20% { opacity: 1; }
	100% { transform: translateY(-2px); height: 0px; opacity: 0; }
}
@keyframes drop-one {
	0% { opacity: 0; transform: rotate(-55deg) translate(-20px); width: 10px; }
	20% { opacity: 1; }
	100% { transform: rotate(-55deg) translate(9px); width: 0px; opacity: 0; }
}
@keyframes drop-two {
	0% { opacity: 0; transform: translate(-20px); width: 10px; }
	20% { opacity: 1; }
	100% { transform: translate(9px); width: 0px; opacity: 0; }
}
@keyframes drop-three {
	0% { opacity: 0; transform: rotate(55deg) translate(-20px); width: 10px; }
	20% { opacity: 1; }
	100% { transform: rotate(55deg) translate(9px); width: 0px; opacity: 0; }
}
@keyframes drop-four {
	0% { opacity: 0; transform: rotate(55deg) translate(20px); width: 10px; }
	20% { opacity: 1;}
	100% { transform: rotate(55deg) translate(-9px); width: 0px; opacity: 0; }
}
@keyframes drop-five {
	0% { opacity: 0; transform: translate(20px); width: 10px; }
	20% { opacity: 1; }
	100% { transform: translate(-9px); width: 0px; opacity: 0; }
}
@keyframes drop-six {
	0% { opacity: 0; transform: rotate(-55deg) translate(20px); width: 10px; }
	20% { opacity: 1; }
	100% { transform: rotate(-55deg) translate(-9px); width: 0px; opacity: 0; }
}
@keyframes drop-seven {
	0% { opacity: 0; transform: translateY(-20px); height: 10px; }
	20% { opacity:1; }
	100% { transform: translateY(2px); height: 0px; opacity: 0; }
}
.pagoDetalle {
	width: 300px;
	max-width: 90%;
	margin: 0 auto;
	color: var( --azul );
	font-weight: bold;
	font-size: 18px;
	margin-top: 40px;
	margin-bottom: 40px;
}
.pagoDetalle span { display: block; color: var( --grisLetras ); }
.divDetail {
	color: var( --azul );
	font-weight: bold;
	font-size: 18px;
}
.divDetail span { color: var( --grisLetras ); }
.downloadLink { color: var( --azul ); }
#respuesta h3 { margin: 40px 0; }
.notificacionesList {
	list-style: none;
	width: 100%;
	margin: 0;
	padding: 0;
}
.notificacionesList li {
	position: relative;
	border-bottom: 1px solid var( --azul );
	padding: 10px 5px;
	color: var( --grisLetras );
	text-align: left;
	transition: all 500ms;
}
.notificacionesList li b { color: var( --azul ); display: block; }
.notificacionesList li:last-child { border-bottom: none; }
.notificacionesList li:after {
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	content: "\f054";
	position: absolute;
	right: 10px;
	top: 10px;
	color: var( --azul );
}
.notificacionesList li:hover { background-color: var( --azul ); color: var( --grisClaro ); }
.notificacionesList li:hover > b { color: var( --blanco ); }
.notificacionesList li:hover:after { color: var( --blanco ); }
.tituloAzul { color: var( --azul ); text-align: center; }
.cierraPagina {
	float: right;
	display: block;
	width: 30px;
	height: 30px;
	border-radius: 50%;
	border: 1px solid var( --azul );
	color: var( --azul );
	text-align: center;
    box-sizing: border-box;
    padding-top: 5px;
}
#info label, #seguridad label, #registro label { margin-top: 10px; display: block; }
.tablaRegistro {
	width: 100%;
	text-align: center;
}
.tablaRegistro th { background-color: var( --azul ); color: var( --blanco ); }
.tableRegistro tr:nth-child(even) { background-color: var( --grisClaro ); }
.StripeElement { margin: 10px; }
.tarjetaName { margin: 10px 0; width: 100%; border: none; background-color: transparent; font-size: 14px; text-align: center; }
.otraCantidad { display: none; }
.tipoHola { display: none; }
.StripeElement, #nombreTarjetaFinal { border-bottom: 1px solid var( --azulInput ); padding: 5px; margin: 10px 0; }
#nombreTarjetaFinal { margin-top: 15px; }
.divMontos, .variasTarjetas, .mensajeTerminos {
	display: none;
}