/**
* Archivo: cvo_files/css_consultoria_sap/estilo_rsp.css
* FUNCION: definir css de la web
* HERENCIA: Ninguna
* FECHA DE CREACION: 08 Agosto 2014
* Propiedad intelectual : © CHristian Adrian Calzada.
*  El autor se reserva de manera exclusiva todos los derechos de distribucion,lear
*  copia y reproduccion ya sea total o parcial de este documento.
*
* MODIFICACIONES
* ==============
*
* Fecha: 19 Octubre 2026
* Motivo: Menu PC: el panel #div_menu_ampliado_desktop_free se reemplaza por #div_menu_ampliado_desktop_certificacion en las dos reglas de paneles
*
* Fecha: 19 Octubre 2026
* Motivo: Pie V2, banda CTA: sol que sale y se oculta por el borde inferior de la banda (::before con sol_horizonte.svg animado)
* Motivo: Barras de navegacion PC y movil: linea dorada biselada recorrida de punta a punta por un destello azul #0c6db3 (::after animado)
* Motivo: Menu PC, panel CURSOS y CARRERAS en columnas (titulos azules, enlaces sin vineta, destacados y franja Canales de atencion)
* Motivo: Menu PC: el modelo en columnas vale para los cuatro paneles (selectores bajo #div_menu_ampliado_desktop), variante con descripcion
*         (.cvomega_lista_desc) y franja SOPORTE HUMANO en mayusculas espaciadas
* Motivo: Franja SOPORTE HUMANO: emoji de 20px alineado verticalmente al texto (enlace inline-flex)
* Motivo: Pagina de carrera: tarjeta principal con video local (poster + autoplay silenciado) y zocalo Compartir; ancho 480px
* Motivo: Hub de area (getCarreraCuerpoHtml): cursos y carreras en tarjetas con cabecera ilustrada (svg/hub_curso.svg, svg/hub_carrera.svg)
* Motivo: Hub de area: fila de nivel compacta en las tarjetas (modo tarjeta_hub de mostrar_nivel_formacion)
* Motivo: Hub de area: solapas como barra de pildoras responsiva (desliza en movil)
* Motivo: Logo PC: cursor de prompt blanco que titila al final de IT-ACADEMY (::after del span, solo CSS)
*
* Fecha: 20 Octubre 2026
* Motivo: Hub maestro (/cursos): ilustracion de cabecera por area de formacion (svg/hub_area_*.svg, clases .cvohub_cab_area_*)
* Motivo: Tarjetas del hub: toda la tarjeta es un link (.cvohub_tarjeta_linkfull) con pildora "Ver mas" al hover; nivel, capa, h3 y boton siguen clickeables por encima
*
* Fecha: 26 Octubre 2026
* Motivo: Capa "Ver presentacion": fondo negro al 50% sobre el poster propio del video (antes vineta suave para el poster generico)
*
* Fecha: 27 Octubre 2026
* Motivo: Barra fija de secciones y de cursos (antes cvo_nav_secciones.css) y menu superior compacto mientras esta a la vista;
*         ahora tambien en el resto del sitio con los accesos a los hubs
*
* Fecha: 30 Octubre 2026
* Motivo: Hub maestro y de area: cabecera en una banda celeste a todo el ancho (.cvohub_hero), solapas con red de nodos y
*         desvanecimiento al pie; tarjeta del titulo sin borde, con sombra difusa y acento lateral dorado-azul   -> IA-CHG-CLAUDE | ID: 30OCT2026-13:50:00 | HUB BANDA CABECERA
*         Comentario "vinculo" (2 veces) pasado de UTF-8 a CP-1252, sin cambio de estilos   -> IA-CHG-CLAUDE | ID: 30OCT2026-13:55:00 | CSS COMENTARIO CP1252
*         Banda del hub en amarillo suave (paleta celeste alternativa comentada en cada regla) y desvanecimiento inferior mas alto
*         para que la red de nodos se vea completa   -> IA-CHG-CLAUDE | ID: 30OCT2026-14:05:00 | HUB BANDA AMARILLO
*         Paleta activa de la banda: celeste claro (la amarilla queda comentada como alternativa)   -> IA-CHG-CLAUDE | ID: 30OCT2026-14:10:00 | HUB BANDA CELESTE
*         La banda sube 0.5em y tapa la franja gris entre el menu y la cabecera (padding de #div_pagina_cont_central)   -> IA-CHG-CLAUDE | ID: 30OCT2026-14:15:00 | HUB BANDA SIN FRANJA SUPERIOR
*         Paleta activa: amarilla. La tarjeta del titulo queda blanca pura, con sombra calida algo mas marcada y un filete dorado
*         de 1px para que se despegue del fondo crema (la celeste queda comentada)   -> IA-CHG-CLAUDE | ID: 30OCT2026-14:20:00 | HUB BANDA AMARILLO TARJETA
*         Preguntas frecuentes (hub y carrera): la pregunta del accordion con 16px de aire a los costados   -> IA-CHG-CLAUDE | ID: 30OCT2026-14:50:00 | FAQ PREGUNTA CON AIRE
*         Carrusel de empresas: vuelta continua sin hueco (lista doble), banda gris a todo el ancho en el cierre de pagina
*         y cabecera con sello ISO 9001, texto y boton al portfolio real   -> IA-CHG-CLAUDE | ID: 30OCT2026-15:05:00 | CARRUSEL EMPRESAS TRAZABLE
*         Paginas de curso y carrera con la banda amarilla de los hubs: cabecera en tarjeta y el bloque de datos (.fondo_onda)
*         con el fondo, la red de nodos y el desvanecimiento   -> IA-CHG-CLAUDE | ID: 30OCT2026-15:50:00 | BANDA CABECERA CURSO Y CARRERA
*         Curso y carrera en celular sin scroll horizontal: h2 con min-width:400px en linea y recuadro de testimonios   -> IA-CHG-CLAUDE | ID: 30OCT2026-15:55:00 | CURSO SIN SCROLL HORIZONTAL MOVIL
*         Preguntas frecuentes en celular: sin el hueco gris arriba de la pregunta (margen de 0.6em arriba y abajo)   -> IA-CHG-CLAUDE | ID: 30OCT2026-16:05:00 | FAQ MOVIL SIN ESPACIO
*         Preguntas frecuentes: la caja de la respuesta siempre a todo el ancho, aunque el texto sea corto   -> IA-CHG-CLAUDE | ID: 30OCT2026-16:15:00 | FAQ RESPUESTA ANCHO COMPLETO
*         Celular y tablet (hasta 910px) en carreras y hubs: la barra de secciones en la cabecera, con el boton de menu
*         (hamburguesa + heraldica) y una linea dorada a la izquierda, en lugar del logo y del gif del menu   -> IA-CHG-CLAUDE | ID: 30OCT2026-16:45:00 | CABECERA MOVIL SECCIONES
*         Pagina de carrera: menu de secciones en una tarjeta semiblanca con sombra, red de nodos mas abajo y menos espacio
*         antes del primer titulo   -> IA-CHG-CLAUDE | ID: 30OCT2026-18:35:00 | CARRERA MENU EN TARJETA
*         Tarjeta del menu en gris neutro claro y el mismo tratamiento en las solapas de los hubs   -> IA-CHG-CLAUDE | ID: 30OCT2026-18:55:00 | MENU EN TARJETA GRIS Y HUBS
*         Tarjeta del menu semitransparente y red de nodos mas abajo y mas visible   -> IA-CHG-CLAUDE | ID: 30OCT2026-19:05:00 | TARJETA TRANSPARENTE Y RED MAS ABAJO
*         Barra fija: faro animado al principio (punto azul que una onda dorada enciende), en carreras, hubs y el resto
*         del sitio   -> IA-CHG-CLAUDE | ID: 30OCT2026-19:35:00 | BARRA FARO
*         Faro mas pegado al titulo de la barra y tambien al principio del menu de secciones de la pagina   -> IA-CHG-CLAUDE | ID: 30OCT2026-19:40:00 | FARO EN MENU DE PAGINA
*         Cabecera movil: boton azul Ver todos fijo a la derecha en hubs de area y resto del sitio   -> IA-CHG-CLAUDE | ID: 30OCT2026-20:00:00 | VER TODOS MOVIL
*         Cabecera movil desde el servidor: boton de menu, linea dorada y CVOSOFT (sin parpadeo de la cabecera vieja)   -> IA-CHG-CLAUDE | ID: 30OCT2026-20:10:00 | CABECERA MOVIL DESDE EL SERVIDOR
*         Tarjeta del titulo en celular y tablet: heraldica + titulo en lugar del logo grande   -> IA-CHG-CLAUDE | ID: 30OCT2026-20:15:00 | CABECERA PAGINA MOVIL CON HERALDICA
*         Menu lateral: titulo con la heraldica y "MENU CVOSOFT"   -> IA-CHG-CLAUDE | ID: 30OCT2026-20:30:00 | MENU LATERAL HERALDICA
*
* Fecha: 31 Octubre 2026
* Motivo: Barra fija: galeria de 7 faros (faro invertido, destello que gira, orbita, gota, guino, gemelos y saltito);
*         functiones_genericas.js sortea uno en cada carga   -> IA-CHG-CLAUDE | ID: 31OCT2026-01:40:00 | FARO GALERIA AL AZAR
*         Faro un 30 por ciento mas grande (scale 1.3 del conjunto) y 2px mas de margen por lado   -> IA-CHG-CLAUDE | ID: 31OCT2026-01:50:00 | FARO 30 POR CIENTO MAS GRANDE
*         Faro un 50 por ciento mas grande (scale 1.5, antes 1.3) y 4px de margen por lado   -> IA-CHG-CLAUDE | ID: 31OCT2026-01:55:00 | FARO 50 POR CIENTO MAS GRANDE
*         Ficha de la carrera como recorrido del alumno: linea dorada con puntos de faro, rotulo de cada paso en azul y la
*         inversion en una caja azul (en lugar de las lineas con triangulo)   -> IA-CHG-CLAUDE | ID: 31OCT2026-02:30:00 | FICHA RECORRIDO
*         Ficha: cuotas segun el pais debajo de la caja azul del precio   -> IA-CHG-CLAUDE | ID: 31OCT2026-02:50:00 | FICHA CUOTAS DEBAJO DEL PRECIO
*         Ficha: bonificacion destacada (recuadro dorado) debajo de la caja azul del precio   -> IA-CHG-CLAUDE | ID: 31OCT2026-03:00:00 | FICHA BONIFICACION DESTACADA
*         Ficha: mas aire entre el recorrido y el menu de secciones (2.4em abajo)   -> IA-CHG-CLAUDE | ID: 31OCT2026-03:05:00 | FICHA AIRE ANTES DEL MENU
*         Pago e Inscripcion: planes Prepaga y Continua en tarjetas lado a lado (o una sola tarjeta con un plan)   -> IA-CHG-CLAUDE | ID: 31OCT2026-03:15:00 | PAGO E INSCRIPCION EN TARJETAS
*         Pago e Inscripcion en una banda azul a todo el ancho con anillos dorados; tarjetas blancas flotando   -> IA-CHG-CLAUDE | ID: 31OCT2026-03:25:00 | PAGO E INSCRIPCION BANDA AZUL
*         Modelo academico en tarjetas desplegables con sello ALL-INCLUSIVE y banda azul de cierre   -> IA-CHG-CLAUDE | ID: 31OCT2026-03:50:00 | MODELO ACADEMICO DESPLEGABLE
*         Temario desde la base en Contenidos (reemplaza al PDF): banda azul a todo el ancho, un nivel por columna   -> IA-CHG-CLAUDE | ID: 31OCT2026-04:40:00 | TEMARIO DESDE LA BASE
*         HiperBonus como pack de regalo (caja azul con sello y dias + cursos desplegables "Incluido")   -> IA-CHG-CLAUDE | ID: 31OCT2026-04:50:00 | HIPERBONUS PACK

*
* --------------------------------------------------------------------------------*/

/* Fuente web del sitio (Source Sans 3, 400/600/700, display=swap). Debe ir antes de la primera regla. */
@import url('https://fonts.googleapis.com/css2?family=Source+Sans+3:wght@400;600;700&display=swap');

/* ================================================================================================================
   1. ELEMENTOS HTML
   Etiquetas estandar (html, body, h1..h4, p, a, img, ...) y pseudo-elementos generales.
   ================================================================================================================ */

html, body {
  max-width: 100%;
}

body {

	overflow-x: hidden; /* oculta cualquier scroll horizontal */

	font-size: 100%; /* Esto setea la fuente estandar en 16px - 1em*/
	color:red;
	font-family: "Source Sans 3", "Segoe UI", Arial, Helvetica, sans-serif;

	background-color: #ffffff;

	background-image:url("/cvo_files/img_sistema_elearning/iconografia_sap_abap/svg/fondo_puntos.svg"),
	radial-gradient(circle at 12% 8%, rgba(14,103,168,0.11) 0%, rgba(14,103,168,0) 38%),
	radial-gradient(circle at 88% 92%, rgba(255,194,59,0.16) 0%, rgba(255,194,59,0) 38%);
	background-size: cover, auto, auto;
	background-position: center center, 0 0, 0 0;
	background-repeat: no-repeat, no-repeat, no-repeat;
	background-attachment: fixed, fixed, fixed;

	margin:0em;
	}

h1 {
	font-weight:700;
	font-size:2em; /* 32px */
	line-height:1.2em;
	color:#0e67a8;
	letter-spacing:-0.01em;
	}

h2 {
	color: #ffffff;
	font-size:1.5em; /* 24px */
	font-weight:600;
	letter-spacing:0.01em;
	background-color:#2975ac;

	display: inline-block;
	border-left: 0.25em solid #f6c119;
	border-radius:0 0.3em 0.3em 0;
	padding:0.4em 1em 0.4em 0.7em;
	}

h3 {
	font-size:1.4375em; /* 23px */
	font-weight:700;
	color:#0c6db3;
	border-top-right-radius: 3px;
  	border-bottom-right-radius: 3px;
	}

h4 {
	font-size:1.125em; /* 18px */
	font-weight:700;
	color:#4a4a4a;
	}

p {
	font-size: 1.125em; /* 18px */
	text-align: left;
	line-height:1.65em;
	}

p, li, table li{
	font-size: 1.125em; /* 18px */
	color: #4a4a4a;
	margin-left:8px;
	margin-right:8px;
	}

/*
table td{
	font-size: 16px;
	line-height: 25px;
	word-spacing:3px;
	letter-spacing:0.2px;
	}
*/
strong {
	font-weight: 700;
	color:#333333;
}

ul li{
		margin-top:0.5em;
		margin-bottom:0.8em;
		/*list-style-image:url(/cvo_files/img_sistema_elearning/iconografia_sap_abap/lastpost.gif) !important;*/
		color: color: #666666 !important;
	}

label{
	cursor:pointer; cursor: hand;
	}

img{
	border: 0;
	}

hr {  border:0; border-top:0.0625em solid #e3e6e8; height:0; margin:2.5em 1em;}

address{
	font-style: normal;
	}

figure {
	display:inline-block;
	border-bottom:1px dotted #dba734;
	margin:0;
	padding:0;

	background-image:url(/cvo_files/imgs_sap_abap/cvosoft_backimg.gif);
	background-position: center center;
	background-repeat: no-repeat;

	}

figure img{
	max-width: 100%;
	height: auto;
}

blockquote{
	display:block;
	background: #fff;
	padding: 15px 20px 15px 45px;
	margin: 0 0 20px;
	position: relative;

	border-left: 0.375em solid #f6c119;
	background-color:#fafbfc;
	border-radius:0 0.5em 0.5em 0;

	-moz-box-shadow: 0 0.125em 0.25em #e3e6e8;
	-webkit-box-shadow: 0 0.125em 0.25em #e3e6e8;
	box-shadow: 0 0.125em 0.25em #e3e6e8;
	}

blockquote a,
blockquote p{
	color: #999 !important;
	margin:0;
	padding:0;
}

blockquote::before{
	content: "\201C"; /*Unicode for Left Double Quote*/

	font-family: Georgia, serif;
	font-size: 60px;
	font-weight: bold;
	color: #d9dde2;

	position: absolute;
	left: 10px;
	top:5px;
	}

blockquote::after{
	/*Reset to make sure*/
	content: "";
	}

blockquote em{
	font-style: italic;
	}

/* RESIZER
---------------------------------*/
::-webkit-resizer {
    border: 2px solid #ffc23b;
    background: #0e67a8;
}

::-moz-resizer {
    border: 2px solid #ffc23b;
    background: #0e67a8;
}

::-ms-resizer {
    border: 2px solid #ffc23b;
    background: #0e67a8;
}

/* Texto seleccionado con el mouse
-----------------------------------*/
::selection {
	background:#2975ac;
	color: #ffffff;
	}

::-moz-selection {
	background:#2975ac;
	color: #ffffff;
	}

::-webkit-selection {
	background:#2975ac;
	color: #ffffff;
	}

a {
	text-decoration: underline;
	color: #666666;
	}

/* Foco de teclado visible con el amarillo de marca */
a:focus-visible,
summary:focus-visible,
button:focus-visible,
input:focus-visible{
	outline:0.125em solid #f6c119;
	outline-offset:0.125em;
	}

p a, li a{
	color: #2975ac !important;
	text-decoration: underline;
	text-decoration-color:#f6c119;
	text-decoration-thickness:0.125em;
	text-underline-offset:0.2em;
	}

p a:hover, li a:hover, ul a:hover{
	background-color:#eaf4fc;
	text-decoration-color:#2975ac;
	}

::-webkit-scrollbar-track{
	-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
	border-radius: 0.625em;
	background-color: #F5F5F5;
	}

::-webkit-scrollbar{
	width: 0.625em;
	background-color: #F5F5F5;
	}

::-webkit-scrollbar-thumb{
	border-radius: 0.625em;
	-webkit-box-shadow: inset 0 0 0.375em rgba(0,0,0,.3);
	background-color: #0e67a8;
	}

/* ================================================================================================================
   2. IDS
   Reglas cuyo selector incluye un #id (contenedores, menu PC y movil, pie, ...), en el orden original.
   ================================================================================================================ */

#video_local_2cols
{
	width:400px;
	border: 0.125em solid #0e67a8;
    background-color:#0e67a8;

	box-shadow: 0 0.2em 0.4em #999999;
	-moz-box-shadow: 0 0.2em 0.4em #999999;
	-webkit-box-shadow: 0 0.1em 0.2em #999999;

	padding:0;
	margin:auto;

	border-radius: 0.3125em;
	-moz-border-radius: 0.3125em;
	-webkit-border-radius:0.3125em;
	-khtml-border-radius: 0.3125em;
}

/* Contenedor Apunte del alumno
-----------------------------------*/
#div_apunte_alumno div ol li,
#div_apunte_alumno div ul li,
#div_apunte_alumno ol li,
#div_apunte_alumno ul li{
	margin-top:1em !important;
	margin-bottom:1em !important;
	list-style-image:url(/cvo_files/img_sistema_elearning/iconografia_sap_abap/lastpost.gif) !important;
	color: color: #666666 !important;
	}

#div_apunte_alumno ol,
#div_apunte_alumno ul{
	margin-bottom:3em !important;
	}

#div_apunte_alumno div{
	margin-bottom:1em !important;
	}

#div_apunte_alumno,
#div_apunte_alumno div,
#div_apunte_alumno div p,
#div_apunte_alumno p {
	/*all: unset;*/
	font-size: 1em !important;
	color: #666666 !important;
	line-height: 1.7em !important;
	word-spacing:0.125em !important;
	margin-bottom:1.125em !important;
	}

/* Contenedor Glosario de terminos SAP
----------------------------------------*/
#divListadoDeLetras{
	padding: 0.625em;
	font-size: 1em;
	line-height: 1.1;

	background: rgba(245,248,248,1);
	background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(238,243,244,1) 14%, rgba(238,243,244,1) 100%);
	background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255,255,255,1)), color-stop(14%, rgba(238,243,244,1)), color-stop(100%, rgba(238,243,244,1)));
	background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(238,243,244,1) 14%, rgba(238,243,244,1) 100%);
	background: -o-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(238,243,244,1) 14%, rgba(238,243,244,1) 100%);
	background: -ms-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(238,243,244,1) 14%, rgba(238,243,244,1) 100%);
	background: linear-gradient(to bottom, rgba(255,255,255,1) 0%, rgba(238,243,244,1) 14%, rgba(238,243,244,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#eef3f4', GradientType=0 );

	border:0.0625em solid #c3d6e3;
	border-top:0.3em solid #c3d6e3;

	border-bottom: 0.0625em solid #FF9900;

	box-shadow: 0 0.125em 0.25em #CCC;
	-moz-box-shadow: 0 0.125em 0.25em #CCC;
	-webkit-box-shadow: 0 0.125em 0.25em #CCC;
	}

#divListadoDeLetras ul{
	list-style-type: none;
	overflow: hidden;

	text-align:center;
	padding-top:1em;
	padding-bottom:1em;
	padding-left:0;
	padding-right:0;
	margin:auto;
	}

#divListadoDeLetras ul li{
	color:#0e67a8 !important;

	cursor:pointer; cursor: hand;
	background-color: #f7f7f7;

	border: 1px solid #FFF;
	box-shadow: 0 0.125em 0.25em #CCC;
	-moz-box-shadow: 0 0.125em 0.25em #CCC;
	-webkit-box-shadow: 0 0.125em 0.25em #CCC;

	border-radius: 0.3125em;
	-moz-border-radius: 0.3125em;
	-webkit-border-radius:0.3125em;
	-khtml-border-radius: 0.3125em;

	float: left;
	text-align: center;

	height: 1.25em;
	width: 1.4375em;

	padding:0.5em;
	margin: 0.6em;
	}

#divListadoDeLetras ul li:hover{
	background-color:#0e67a8;
	color: #FFF !important;

	box-shadow: none !important;
	-moz-box-shadow: none !important;
	-webkit-box-shadow: none !important;

	}

#div_listar_terminos hr{
	margin-top:2em;
	margin-bottom:2em;
	}

#div_nombre_alumno_apunte h3:hover,
#div_listar_lecciones_apuntes h3:hover,
#div_listar_apuntes h3:hover,
#div_listar_terminos h3:hover{
	text-decoration: underline !important;
	}

#glosario_list_termino_exacto ul li{
	margin-top:1em;
	margin-bottom:1em;
	list-style-image:url(/cvo_files/img_sistema_elearning/iconografia_sap_abap/lastpost.gif);
	}

li, #div_pagina_cont_central a{
	color: #666666;
	line-height: 1.3em;
	}

/* NAVEGADOR MOBILES POR MODULOS Y POR NIVELES
-----------------------------------------------*/
#div_nav_modulos,
#div_nav_niveles{
	margin-top:1em;

	box-shadow: 0 0.125em 0.25em #999 !important;
	-moz-box-shadow: 0 0.125em 0.25em #999!important;
	-webkit-box-shadow: 0 0.125em 0.25em #999!important;

	display:none;
	}

#div_nav_modulos .tres_cols-col_der a,
#div_nav_modulos .tres_cols-col_izq a,
#div_nav_modulos .tres_cols-col_centro a{
	padding-top:1.5em !important;
	padding-bottom:1.5em !important;
	}

#div_nav_modulos .tres_cols-col_centro h1{
	text-shadow:none !important;
	font-size:1em !important;
	padding-top:0 !important;
	padding-bottom:0 !important;
	margin:0 !important;
	padding:0 !important;
	letter-spacing:0;
	word-spacing:0 !important;
	color:#f7c84a !important;
	}

#div_menu_ampliado_desktop p a, #div_menu_ampliado_desktop li a {
	color: #666666 !important;
	text-decoration: none;
	border-bottom: 0px !important;;

}

/* Contenedor ppal del cuerpo de la pagina */
#div_pagina_ppal{
	width:100%;
	margin-top:70px;

	margin-bottom:2em;
	margin-left:auto;
	margin-right:auto;
	}

#div_pagina_cont_central{
	padding: 0.5em;
	/* Capa traslucida que se desvanece hacia los laterales (los bordes quedan transparentes) */
	background-color: rgba(255, 255, 255, 0.7);
	box-shadow: 0 0 6em 4em rgba(255, 255, 255, 0.7);

	max-width:80em;

	margin-left:auto;
	margin-right:auto;
}

/* Footer - Formateo del div pie de pagina
-------------------------------------------*/
#div_footer{
	border-top: 1px solid #ccc;
	padding:10px;
	padding-bottom: 100px;

	margin-left:auto;
	margin-right:auto;

	background-color: rgba(191, 191, 191, 0.2); /* Negro con 50% de opacidad */
	}

#div_footer	p{
    font-size: 0.875em;
	text-align:center;
	line-height: 1.5em;
	word-spacing:0;
	letter-spacing:0;
	}

#div_bottom_boletin, #div_bottom_scroll{
	bottom: -0.5em;
	right: 0.3125em;
	position: fixed;
	}

#div_bottom_scroll{
	display:none;
	}

#div_bottom_scroll a{
	padding:0.375em;
	text-align:center;
	margin-bottom:-2px;
}

.tarjeta_curso_cuadro_video #div_533_video-local{
	line-height:0;
	position:relative; /* ancla del boton Activar sonido */
	}

/*-------------------------------------------------
ELEMENTOS DE LAS BARRAS DE NAVEGACION
--------------------------------------------------*/
/* BARRA DE NAVEGACION PPAL DESKTOP
-----------------------------------*/
#div_nav_ppal_desktop{

	/*
	background-image:url(/cvo_files/imgs_sap_abap/logos/iso/isocert.png) ;
	background-position: right center;
	background-repeat: no-repeat;

    opacity: 0.8;
    filter: alpha(opacity=80);
	*/

	background-color:#FFF;
	width:100%;
	display: inline-block;
	padding-bottom:0.3125em;
	padding-top:0.3125em;

	/*Menu superior flotante */
	top: 0;

	/* DEFINO EL ANCHO DEL CONTENEDOR PRINCIPAL a 980px (980/16=61.25em) */
	/*max-width:61.25em;*/
	/*position: fixed;*/

	position: fixed;

	z-index:999;

	/*Sombra suave en la parte inferior y linea amarilla de marca (fija: no depende del menu desplegable) */
	-webkit-box-shadow: 0 0.25em 1em rgba(0,0,0,0.06);
    -moz-box-shadow: 0 0.25em 1em rgba(0,0,0,0.06);
    box-shadow: 0 0.25em 1em rgba(0,0,0,0.06);

	border-bottom: 0.1875em solid #f6c119;
	}

/* Linea dorada de las barras PC y movil: ::after = bisel dorado fijo; ::before = destello azul #0c6db3 que cruza todo
   el ancho en 6 pasadas irregulares (ciclo 46,5 s). Se mueve con transform (GPU, sin repintar): antes animaba
   background-position y repintaba todo el header en cada cuadro */
#div_nav_ppal_desktop::after,
#div_nav_ppal_movil::after{
	content:"";
	position:absolute;
	left:0;
	right:0;
	bottom:-0.1875em;
	height:0.1875em;
	z-index:0;
	pointer-events:none;
	background-image:linear-gradient(180deg, #ffe27a 0%, #f6c119 50%, #c9960c 100%);
	}

#div_nav_ppal_desktop::before,
#div_nav_ppal_movil::before{
	content:"";
	position:absolute;
	left:0;
	bottom:-0.1875em;
	width:30%;
	height:0.1875em;
	z-index:1;
	pointer-events:none;
	background-image:linear-gradient(90deg, rgba(12,109,179,0) 0%, #0c6db3 50%, rgba(12,109,179,0) 100%);
	-webkit-transform:translateX(-100%);
	transform:translateX(-100%);
	will-change:transform;

	/*animation:cvo_linea_brillo 46.5s linear infinite;*/
	-webkit-animation:cvo_linea_brillo 93s linear infinite;
	animation:cvo_linea_brillo 93s linear infinite;
	}

/* Linea dorada de las barras PC y movil: ::after tapa el border-bottom (mismo grosor) con dos capas:
   abajo un bisel dorado fijo (claro arriba, #f6c119 al medio, oscuro abajo); arriba un destello azul #0c6db3
   que cruza TODO el ancho, de izquierda a derecha, en pasadas de 2,4 s separadas por pausas irregulares de 3 a 10 s
   (ciclo de 46,5 s con 6 pasadas: se percibe al azar sin usar JS) */
/*
#div_nav_ppal_desktop::after,
#div_nav_ppal_movil::after{
	content:"";
	position:absolute;
	left:0;
	right:0;
	bottom:-0.1875em;
	height:0.1875em;
	pointer-events:none;
	background-image:
		linear-gradient(90deg, rgba(12,109,179,0) 0%, #0c6db3 50%, rgba(12,109,179,0) 100%),
		linear-gradient(180deg, #ffe27a 0%, #f6c119 50%, #c9960c 100%);
	background-repeat:no-repeat, no-repeat;
	background-size:30% 100%, 100% 100%;
	background-position:-43% 0, 0 0;
	-webkit-animation:cvo_linea_brillo 46.5s linear infinite;
	animation:cvo_linea_brillo 46.5s linear infinite;
	}

@-webkit-keyframes cvo_linea_brillo{
	0%{ background-position:-43% 0, 0 0; }
	5.161%{ background-position:143% 0, 0 0; }
	5.183%{ background-position:-43% 0, 0 0; }
	13.118%{ background-position:-43% 0, 0 0; }
	18.28%{ background-position:143% 0, 0 0; }
	18.301%{ background-position:-43% 0, 0 0; }
	33.548%{ background-position:-43% 0, 0 0; }
	38.71%{ background-position:143% 0, 0 0; }
	38.731%{ background-position:-43% 0, 0 0; }
	46.022%{ background-position:-43% 0, 0 0; }
	51.183%{ background-position:143% 0, 0 0; }
	51.204%{ background-position:-43% 0, 0 0; }
	72.473%{ background-position:-43% 0, 0 0; }
	77.634%{ background-position:143% 0, 0 0; }
	77.656%{ background-position:-43% 0, 0 0; }
	86.022%{ background-position:-43% 0, 0 0; }
	91.183%{ background-position:143% 0, 0 0; }
	91.204%{ background-position:-43% 0, 0 0; }
	100%{ background-position:-43% 0, 0 0; }
}

@keyframes cvo_linea_brillo{
	0%{ background-position:-43% 0, 0 0; }
	5.161%{ background-position:143% 0, 0 0; }
	5.183%{ background-position:-43% 0, 0 0; }
	13.118%{ background-position:-43% 0, 0 0; }
	18.28%{ background-position:143% 0, 0 0; }
	18.301%{ background-position:-43% 0, 0 0; }
	33.548%{ background-position:-43% 0, 0 0; }
	38.71%{ background-position:143% 0, 0 0; }
	38.731%{ background-position:-43% 0, 0 0; }
	46.022%{ background-position:-43% 0, 0 0; }
	51.183%{ background-position:143% 0, 0 0; }
	51.204%{ background-position:-43% 0, 0 0; }
	72.473%{ background-position:-43% 0, 0 0; }
	77.634%{ background-position:143% 0, 0 0; }
	77.656%{ background-position:-43% 0, 0 0; }
	86.022%{ background-position:-43% 0, 0 0; }
	91.183%{ background-position:143% 0, 0 0; }
	91.204%{ background-position:-43% 0, 0 0; }
	100%{ background-position:-43% 0, 0 0; }
}
*/
/* Cursor de prompt al final de IT-ACADEMY: el texto es el span de la franja azul del logo (el unico span dentro
   de un div de .text_encima). Guion bajo blanco que titila; ocupa siempre su lugar, el ancho no salta */
/*
#div_menu_ppal_desktop_logo .text_encima div span::after{
	content:"_";
	margin-left:-0.5em;
	color:#ffffff;
	-webkit-animation:cvo_cursor_prompt 1.1s steps(1) infinite;
	animation:cvo_cursor_prompt 1.1s steps(1) infinite;
	}

@-webkit-keyframes cvo_cursor_prompt{
	0%{ opacity:1; }
	50%{ opacity:0; }
	100%{ opacity:0; }
}

@keyframes cvo_cursor_prompt{
	0%{ opacity:1; }
	50%{ opacity:0; }
	100%{ opacity:0; }
}

@media (prefers-reduced-motion: reduce){
	#div_nav_ppal_desktop::after,
	#div_nav_ppal_movil::after,
	#div_menu_ppal_desktop_logo .text_encima div span::after{
		-webkit-animation:none;
		animation:none;
		}
}
*/
/* Botones de accion a la derecha de la barra (Campus y Compartir; los emite func_mostrar_menu_top) */
#div_nav_acciones_desktop{
	float:right;
	padding-top:1.1em;
	padding-right:1.25em;
	white-space:nowrap;
	}

#div_menu_ppal_desktop_logo{
	float: left;
	display:inline;
	margin-top:0;
	margin-left:0.3em;
	}

#div_menu_ppal_desktop{
	display:inline;
	float: left;
	padding-top:1.3em;
	}

/* BARRA DE NAVEGACION PPAL MOVIL
----------------------------------*/
/*Contenedor ppal para la navegacion movil, abarca el head y tambien la lista de menu */
#div_nav_ppal_movil{
	display: none;
	top: 0;
	position: fixed;
	background-color:#FFF;
	width:100%;
	border-bottom: 0.1875em solid #f6c119;
	z-index:100;

	/*Sombra suave en la parte inferior */
	-webkit-box-shadow: 0 0.25em 1em rgba(0,0,0,0.06);
    -moz-box-shadow: 0 0.25em 1em rgba(0,0,0,0.06);
    box-shadow: 0 0.25em 1em rgba(0,0,0,0.06);
	}

#img_logo_nav_ppal_movil, #img_logo_nav_ppal_desktop{
	float:left;
	margin-left:0.3125em;
	margin-top:0.1875em;
	margin-bottom:0.1875em;
	}

#img_menu_nav_ppal_movil{
	float:right;
	margin-right:0.3125em;
	margin-top:1.25em;
	}

/* MENU DE OPCIONES del NAV AMPLIADO MOVIL
-------------------------------------------*/
#div_nav_ampl_movil:hover{
	opacity:1;
	}

/* Paneles del menu PC: cursos (APRENDER), certificacion, empresas, alumnos (CVOSOFT); el panel free ya no existe */
#div_menu_ampliado_desktop_alumnos,
#div_menu_ampliado_desktop_empresas,
#div_menu_ampliado_desktop_certificacion,
#div_menu_ampliado_desktop_cursos{
	display:none;
	padding-bottom:1em;
	padding-top:1em;
}

#div_menu_ampliado_desktop_alumnos li,
#div_menu_ampliado_desktop_empresas li,
#div_menu_ampliado_desktop_certificacion li,
#div_menu_ampliado_desktop_cursos li
{
	font-size: inherit;
	color: inherit;
	line-height: inherit;
	word-spacing: normal;
	letter-spacing: normal;
	margin-left: 0;
	margin-right: 0;
	}

#div_menu_ampliado_desktop{

	/*max-width:980px;*/
	width:100%;

	top: 70px;
	position: fixed;

	/*position: absolute;*/
	z-index:101;

	margin:0;
	padding:0;

	margin-top:-0.3em;

	background-color:#f7f8fa;

	box-shadow: 0 1em 2em rgba(0,0,0,0.15);
	-moz-box-shadow: 0 1em 2em rgba(0,0,0,0.15);
	-webkit-box-shadow: 0 1em 2em rgba(0,0,0,0.15);
}

#div_menu_ampliado_desktop table{
	margin:auto;
    font-size: 14px;
    color: #4a4a4a;

}

#div_menu_ampliado_desktop table td
{
	padding:0.5em;
}

#div_menu_ampliado_desktop a
{
	text-decoration:none;
	padding-bottom:0.4em;
	padding-top:0.4em;
	padding-right:2em;

}

#div_menu_ampliado_desktop a:hover
{
	border-bottom: 2px solid #f6c119;
	background-color:#bfe1fa;

}

#div_menu_ampliado_desktop ul
{
	padding-left:1.5em;

}

#div_menu_ampliado_desktop ul li
{
	padding:0;

}

#div_menu_ampliado_desktop .cvomega_lista{
	list-style:none;
	margin:0 0 1.3em 0;
	padding:0;
	}

#div_menu_ampliado_desktop .cvomega_lista li{
	margin:0;
	padding:0;
	line-height:1.2em;
	}

#div_menu_ampliado_desktop .cvomega_lista li a{
	display:inline-block;
	padding:0.3em 0;
	font-size:15px;
	white-space:nowrap;
	color:#4a4a4a !important;
	text-decoration:none;
	border-bottom:0;
	}

#div_menu_ampliado_desktop .cvomega_lista li a:hover{
	color:#0c6db3 !important;
	background-color:transparent;
	border-bottom:0;
	text-decoration:underline;
	text-decoration-color:#f6c119;
	text-decoration-thickness:0.125em;
	text-underline-offset:0.2em;
	}

/* Variante con descripcion (EMPRESAS, recursos de CVOSOFT): nombre del servicio y una bajada gris debajo */
#div_menu_ampliado_desktop .cvomega_lista_desc li a{
	white-space:normal;
	max-width:19em;
	padding:0.35em 0;
	}

#div_menu_ampliado_desktop .cvomega_izq a.cvomega_dest{
	flex:0 1 auto;
	padding-right:5em;
	}

#div_menu_ampliado_desktop a.cvomega_dest{
	flex:1 1 auto;
	display:block;
	padding:0.2em 1.5em 0.2em 0;
	text-decoration:none;
	border-bottom:0;
	}

#div_menu_ampliado_desktop a.cvomega_dest:hover{
	background-color:transparent;
	border-bottom:0;
	}

#div_menu_ampliado_desktop a.cvomega_dest:hover .cvomega_dest_texto{
	text-decoration:underline;
	text-decoration-color:#f6c119;
	text-underline-offset:0.2em;
	}

/* Enlace de la franja: inline-flex centra verticalmente el emoji de 20px con el texto */
#div_menu_ampliado_desktop .cvomega_barra a{
	display:inline-flex;
	align-items:center;
	padding:0.6em 0;
	font-size:13px;
	font-weight:700;
	letter-spacing:0.12em;
	color:#ffffff !important;
	text-decoration:none;
	border-bottom:0;
	}

#div_menu_ampliado_desktop .cvomega_barra a:hover{
	color:#f6c119 !important;
	background-color:transparent;
	border-bottom:0;
	}

#div_nav_ampl_movil{
	height:100%;
	width:261px;
	max-width:18em;

	position: fixed;
	z-index:101;
	top: 70px;

	margin:0;
	margin-top:-9px;
	display:none;

	padding:0;
	overflow:scroll;

	opacity:0.6;

	border-right:0;
	border: 0.2em solid #ffffff;

	background-color:#e9eaea;

	box-shadow: 0 0.125em 0.25em #666666;
	-moz-box-shadow: 0 0.125em 0.25em #666666;
	-webkit-box-shadow: 0 0.125em 0.25em #666666;

	border-radius: 0.625em;
	-moz-border-radius: 0.625em;
	-webkit-border-radius: 0.625em;
	-khtml-border-radius: 0.625em;
	}

#div_nav_ampl_movil::-webkit-scrollbar-track{
	-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
	border-radius: 0.625em;
	background-color: #F5F5F5;
	}

#div_nav_ampl_movil::-webkit-scrollbar{
	width: 0.625em;
	background-color: #F5F5F5;
	}

#div_nav_ampl_movil::-webkit-scrollbar-thumb{
	border-radius: 0.625em;
	-webkit-box-shadow: inset 0 0 0.375em rgba(0,0,0,.3);
	background-color: #f7c84a;
	}

#div_nav_qr{
	display:inline;
	max-width:110px;
	width:100%;
	top: 0.2em;
	right: 0.3125em;
	position: fixed;
	background-color:#ccc;
	text-align:center;

	border-radius: 0.325em;
	-moz-border-radius: 0.325em;
	-webkit-border-radius: 0.325em;
	-khtml-border-radius: 0.325em;

    opacity: .7;
    transition: opacity .6s ease-out;
    -moz-transition: opacity .6s ease-out;
    -webkit-transition: opacity .6s ease-out;
    -o-transition: opacity .6s ease-out;

	}

#img-qr-lat:hover {
	cursor:pointer; cursor: hand;
}

#div_nav_qr:hover {
    opacity: 1;

	transform:scale(1.3);
	margin:1em;
	-webkit-transition:.5s;
	-moz-transition:.5s;
	-transition:.5s;

	margin-top:2em;

}

#div_nav_ampl_movil dl{
	margin:0;
	padding:0;
	background-color:#b8cddc;
	}

#div_nav_ampl_movil dt{
	background-color:#2d92d9;
	font-size:1em;
	padding:0.625em;
	padding-bottom:0.3em;
	margin-top:0.5em;
	color:#0b4e7e;
	font-weight:bold;
	color:#f7ce74;
	text-shadow: 0.125em 0.125em 0.125em #757576 !important;
	border-bottom:  0.125em solid #1d6ea6;
	border-top:  0.125em solid #33a5f5;
}

#div_nav_ampl_movil dd{
	margin:0.125em;
	margin-left:2em;
	padding:0;
}

#div_nav_ampl_movil dd a{
	display:block; /*Convertimos el vínculo en un bloque. -> IA-CHG-CLAUDE | ID: 30OCT2026-13:55:00 | CSS COMENTARIO CP1252*/
	padding:0.8em;
	text-decoration:none;
	font-size:0.875em;
	font-weight:bold;
	color:#FFFFFF;
	background-color:#0163a9;
}

#div_nav_ampl_movil dd a:hover{
	color:#f7ce74;
	background-color:#0b4e7e;
}

/* MENU DE OPCIONES del NAV PPAL MOVIL
---------------------------------------/*

/*Por defecto el div con el menu permanece oculto*/
#div_ul_nav_ppal_movil{
	display: none;
	}

#div_ul_nav_ppal_movil ul{
	list-style:none;
	margin:0;
	padding:0;
	}

#div_ul_nav_ppal_movil li{
	margin:0.3125em;
	padding:0;
	}

#div_ul_nav_ppal_movil li a{
	display:block; /*Convertimos el vínculo en un bloque. -> IA-CHG-CLAUDE | ID: 30OCT2026-13:55:00 | CSS COMENTARIO CP1252*/
	padding:0.625em;
	text-decoration:none;
	text-align:center;
	font-size:1em;
	font-weight:bold;
	color:#FFFFFF;
	background-color:#006dba;
	}

#div_ul_nav_ppal_movil li a:hover{
	color:#f7ce74;
	background-color:#0b4e7e;
	}

#div_contenedor_carreras_movil{
	border: 0.1875em solid #006dba;
	margin-top:-0.3em;
	}

#tabla_div_contenedor_carreras_movil{
	max-width:100%;
	width:100%;
	background-color:#ffffff;
	}

/* header_ppal_desktop -> principal de las paginas, contiene el H1 */
#header_ppal_desktop
{
	background-color:#ffffff;
	border: 0.0625em solid #dfe7ee;
	border-bottom: 0.1875em solid #0c6db3;
	border-radius: 0.3125em;
	-moz-border-radius: 0.3125em;
	-webkit-border-radius: 0.3125em;
	-khtml-border-radius: 0.3125em;

	box-shadow: 0 0.25em 0.75em rgba(14,103,168,0.10);
	-moz-box-shadow: 0 0.25em 0.75em rgba(14,103,168,0.10);
	-webkit-box-shadow: 0 0.25em 0.75em rgba(14,103,168,0.10);
	padding:0.9em 1em;
	margin-top:0.625em;
	margin-bottom:0.625em;

	background-color:#ffffff;
	background-image: linear-gradient(180deg, #ffffff 0%, #f4f7fa 100%);

	}

#header_ppal_desktop_logo{
	float:left;
	}

#header_ppal_desktop h1{
	margin:0;
	}

/* Breadcrumb como franja al pie de la tarjeta del header*/
#header_ppal_desktop #div_breadcrumb{
	clear:both;
	overflow:hidden;
	margin:0.9em -1em -0.9em -1em;
	padding:0.3em 0.75em;
	border-top:0.0625em solid #e3e6e8;
	background-color:#f7f8fa;
	border-radius:0 0 0.25em 0.25em;
	}

/* Contenedores Responsivos de Video
--------------------------------------*/
#div_contenedor_video_y_descripcion{
	background-color:#000;
	max-width:61.25em; /* DEFINO EL ANCHO DEL CONTENEDOR PRINCIPAL a 980px*/
	width:100%; /* si el ancho es menor se adapta automaticamente al ancho disponible*/
	margin:auto;
	}

.div_contenedor_tips_ambar #colderecha,
.div_contenedor_tips_verde #colderecha,
.div_contenedor_tips_celeste #colderecha,
.div_contenedor_tips_marron #colderecha{
	padding:0.5em;
	}

.div_contenedor_tips_ambar #colizquierda,
.div_contenedor_tips_verde #colizquierda,
.div_contenedor_tips_celeste #colizquierda,
.div_contenedor_tips_marron #colizquierda{
	vertical-align: middle;
	}

.div_contenedor_tips_ambar #colizquierda img,
.div_contenedor_tips_verde #colizquierda img,
.div_contenedor_tips_celeste #colizquierda img,
.div_contenedor_tips_marron #colizquierda img{
	padding-top:0.5em;
	padding-bottom:0.5em;
	padding-left:0.2em;
	padding-right:0.2em;
	}

.div_contenedor_tips_ambar #colizquierda{
	background-color:#fcfbf4;
	}

.div_contenedor_tips_verde #colizquierda{
	background-color:#f5f8f1;
	}

.div_contenedor_tips_celeste #colizquierda{
	background-color:#f8f9fb;
	}

.div_contenedor_tips_marron #colizquierda{
	background-color:#f9f7f4;
	}

/* Solapas para carreras */
#div_contenedor_menu_solapas_mobile{
	display:none;
	}

#div_contenedor_solapas_master{
	border:0.0625em solid #c3d6e3;
	border-top:0.5em solid #c3d6e3;
	border-bottom:0.5em solid #9fb8ca;
	padding-left:0.3em;
	padding-right:0.3em;
	margin-right:-0.125em;

	box-shadow: 0 0.125em 0.25em #CCC;
	-moz-box-shadow: 0 0.125em 0.25em #CCC;
	-webkit-box-shadow: 0 0.125em 0.25em #CCC;
	}

#div_sombrea_pantalla{
	width: 100%;
	min-height: 100%;
	height: auto !important;
	position: fixed;
	top:0;
	left:0;
	background-color:#000000;
	opacity:0.5;
	display:none;
}

/* FOOTER V2*/
/* Contenedor: anula el formato del pie anterior (borde, padding y fondo) */
#div_footer.cvofoot{
	border-top:0;
	padding:0;
	margin:0;
	margin-top:2em;
	background:none;
	}

#div_footer .cvofoot_col ul{
	list-style:none;
	margin:0;
	padding:0;
	}

#div_footer .cvofoot_col li{
	margin:0;
	padding:0;
	font-size:0.9375em;
	line-height:1.4em;
	color:#666666;
	word-spacing:0;
	letter-spacing:0;
	border-bottom:0.0625em solid #dcdcdc;
	}

#div_footer .cvofoot_col li a{
	display:block;
	padding:0.6em 0.3em;
	color:#666666 !important;
	text-decoration:none;
	border-bottom:0;
	-webkit-transition:.2s;
	-moz-transition:.2s;
	transition:.2s;
	}

#div_footer .cvofoot_col li a:hover{
	color:#0e67a8 !important;
	background-color:#bfe1fa;
	padding-left:0.6em;
	}

#div_footer .cvofoot_legal p{
	font-size:1em;
	line-height:1.6em;
	color:#666666;
	text-align:left;
	margin:0 0 0.8em 0;
	word-spacing:0;
	letter-spacing:0;
	}

#div_footer .cvofoot_legal p a{
	color:#2975ac !important;
	text-decoration:none;
	border-bottom:0.0625em dashed #f6c119;
	}

/* MENU MOVIL V2
-----------------------------------------------------------------------------------*/
/* Panel: pisa el formato del menu anterior (bordes redondeados, opacidad 0.6, fondo gris) */
#div_nav_ampl_movil.cvomenu{
	width:17em;
	max-width:88vw;
	padding:0;
	padding-bottom:6em;
	box-sizing:border-box;
	opacity:1;
	border:0;
	border-right:0.0625em solid #dcdcdc;
	border-radius:0;
	-moz-border-radius:0;
	-webkit-border-radius:0;
	background-color:#ffffff;
	box-shadow:0.25em 0 1em rgba(0,0,0,0.18);
	-moz-box-shadow:0.25em 0 1em rgba(0,0,0,0.18);
	-webkit-box-shadow:0.25em 0 1em rgba(0,0,0,0.18);
	overflow-y:auto;
	overflow-x:hidden;
	color:#575757;
	}

#div_nav_ampl_movil.cvomenu:hover{
	opacity:1;
	}

/* Listas: pisan las reglas globales de ul/li/a */
#div_nav_ampl_movil .cvomenu_lista{
	list-style:none;
	margin:0;
	padding:0;
	}

#div_nav_ampl_movil .cvomenu_lista li{
	margin:0;
	padding:0;
	line-height:1.3em;
	font-size:1em;
	word-spacing:0;
	letter-spacing:0;
	}

#div_nav_ampl_movil .cvomenu_lista li a{
	display:block;
	padding:0.65em 1em 0.65em 1.25em;
	font-size:0.9375em;
	color:#575757 !important;
	text-decoration:none;
	border-bottom:0;
	border-left:0.25em solid transparent;
	-webkit-transition:.15s;
	-moz-transition:.15s;
	transition:.15s;
	}

#div_nav_ampl_movil .cvomenu_lista li a:hover{
	background-color:#f3f6f9;
	color:#0e67a8 !important;
	padding-left:1.5em;
	}

/* Pagina actual: barra amarilla, fondo celeste suave, texto azul */
#div_nav_ampl_movil .cvomenu_lista li.cvomenu_activo a{
	background-color:#eef6fc;
	color:#0e67a8 !important;
	font-weight:bold;
	border-left-color:#f6c119;
	}

.cvomod_media #div_533_video-local{
	line-height:0;
	}

/* BARRA FIJA DE SECCIONES Y DE CURSOS (functiones_genericas.js): en carreras y hubs, las secciones de la pagina; en el
   resto del sitio, los accesos a los hubs (nav#cvo_nav_global de func_menu_pagina, oculto: lo lee el script).
   Antes en cvo_nav_secciones.css, cargado solo en /cursos
-----------------------------------------------------------------------------------------------------------------------*/
#cvo_nav_global{
	display:none !important;
	}

/* MENU SUPERIOR COMPACTO: mientras la barra de secciones esta a la vista (clase en <html> que pone el script), el menu
   superior PC queda mas fino: heraldica chica + filete dorado + la palabra CVOSOFT del mismo tamanio, sin IT-ACADEMY.
   Al volver arriba (la barra se oculta) se quita la clase y el menu vuelve a su estado normal.
   Los !important pisan los estilos en linea del logo (func_menu_pagina) */
html.cvo_cabecera_compacta #div_nav_ppal_desktop{
	padding-top:0.125em;
	padding-bottom:0.125em;
	}

html.cvo_cabecera_compacta #img_logo_nav_ppal_desktop{
	display:none;
	}

/* El logo deja de tener alto propio (la imagen esta oculta): mismo ancho que con la heraldica, asi las opciones del menu
   no se corren de lugar al pasar a compacto */
html.cvo_cabecera_compacta #div_menu_ppal_desktop_logo{
	position:relative;
	width:14.95em;
	height:2.4em;
	}

html.cvo_cabecera_compacta #div_menu_ppal_desktop_logo > div{
	margin-top:0 !important;
	}

/* Heraldica chica (header-heraldica-compacta.png: 49x64, se muestra a 25x32 y queda nitida en pantallas retina) y filete
   dorado vertical como el del logo normal, dibujado en CSS para que salga nitido */
html.cvo_cabecera_compacta #div_menu_ppal_desktop_logo::before{
	content:"";
	position:absolute;
	left:0.3125em;
	top:50%;
	width:25px;
	height:32px;
	margin-top:-16px;
	background-image:url(/cvo_files/template_web_consultoria_abap/images_consultoria_abap/headers/header-heraldica-compacta.png);
	background-repeat:no-repeat;
	background-position:center center;
	background-size:25px 32px;
	}

html.cvo_cabecera_compacta #div_menu_ppal_desktop_logo::after{
	content:"";
	position:absolute;
	left:38px;
	top:50%;
	width:2px;
	height:28px;
	margin-top:-14px;
	border-radius:1px;
	background-image:linear-gradient(180deg, #e8c27a 0%, #d09c39 50%, #e8c27a 100%);
	}

html.cvo_cabecera_compacta #div_menu_ppal_desktop_logo .text_encima{
	position:absolute !important;
	left:48px;
	top:50%;
	margin:0 !important;
	-webkit-transform:translateY(-50%) scaleY(1.1) !important;
	transform:translateY(-50%) scaleY(1.1) !important;
	line-height:1em !important;
	}

/* Franja IT-ACADEMY (unico div dentro del texto del logo) */
html.cvo_cabecera_compacta #div_menu_ppal_desktop_logo .text_encima div{
	display:none;
	}

html.cvo_cabecera_compacta #div_menu_ppal_desktop{
	padding-top:0.6em;
	}

html.cvo_cabecera_compacta #div_nav_acciones_desktop{
	padding-top:0.3em;
	}

/* ================================================================================================================
   3. CLASES
   Reglas por clase o atributo, en el orden original (las de un mismo componente quedan juntas).
   ================================================================================================================ */

img[src^="data:image"] {
 		max-width: 100%;
        height: auto;
        border: 0.0625em solid #e3e6e8;
        border-radius: 10px;
        box-shadow: 0 0.125em 0.25em #CCC;
        text-decoration:none;
        padding:0;
		margin-top:10px;
		margin-bottom:10px;
}

.link_glosario{
	border-bottom:3px dashed #f7c149;
	padding:1px;
	}

/* PARRAFOS QUE REEMPLZAN A LOS UL / LI
----------------------------------------*/
.ptabulador_flecha_roja,
.ptabulador_expandir_contraer,
.ptabulador_flecha_celeste,
.ptabulador_flecha_marron,
.ptabulador_flecha_gris,
.ptabulador_carreras,
.ptabulador_video,
.ptabulador_audio,
.ptabulador_video,
.ptabulador_regalo,
.ptabulador_herramienta,
.ptabulador_cubos,
.ptabulador_flecha_verde_anim,
.ptabulador_flecha_roja_anim,
.ptabulador_flecha_celeste_anim,
.ptabulador_flecha_marron_anim,
.ptabulador_flecha_gris_anim
	{
	font-size:1.125em; /* 18px */
	color:#4a4a4a;
	line-height:1.65em;
	margin:0.5em 8px 0.8em 8px;
	padding-left:24px;
	background-repeat:no-repeat;
	background-position:8px 7px;
}

.ptabulador_flecha_roja{
	background-image:url(/cvo_files/img_sistema_elearning/iconografia_sap_abap/lastpost_rojo.gif);
	}

.ptabulador_expandir_contraer{
	background-image:url(/cvo_files/img_sistema_elearning/iconografia_sap_abap/ico-subir-bajar.png);
	}

.ptabulador_flecha_celeste{
	background-image:url(/cvo_files/img_sistema_elearning/iconografia_sap_abap/lastpost.gif);
	}

.ptabulador_flecha_marron{
	background-image:url(/cvo_files/img_sistema_elearning/iconografia_sap_abap/lastpost_marron.gif);
	}

.ptabulador_flecha_gris{
	background-image:url(/cvo_files/img_sistema_elearning/iconografia_sap_abap/lastpost_off.gif);
	}

.ptabulador_carreras{
	background-image:url(/cvo_files/img_sistema_elearning/iconografia_sap_abap/carreas_sap.png);
	}

.ptabulador_video{
	background-image:url(/cvo_files/img_sistema_elearning/iconografia_sap_abap/camara.gif);
	}

.ptabulador_audio{
	background-image:url(/cvo_files/img_sistema_elearning/iconografia_sap_abap/sound.png);
	}

.ptabulador_video{
	background-image:url(/cvo_files/img_sistema_elearning/iconografia_sap_abap/camara.gif);
	}

.ptabulador_regalo{
	background-image:url(/cvo_files/imgs_sap_abap/gift_small.png);
	}

.ptabulador_herramienta{
	background-image:url(/cvo_files/img_sistema_elearning/iconografia_sap_abap/ico_conf.gif);
	}

.ptabulador_cubos{
	background-image:url(/cvo_files/img_sistema_elearning/iconografia_sap_abap/kdf.png);
	}

.ptabulador_flecha_verde_anim{
	background-image:url(/cvo_files/img_sistema_elearning/iconografia_sap_abap/lastpost_verde_anim.gif);
	}

.ptabulador_flecha_roja_anim{
	background-image:url(/img_sistema_elearning/iconografia_sap_abap/lastpost_rojo_anim.gif);
	}

.ptabulador_flecha_celeste_anim{
	background-image:url(/cvo_files/img_sistema_elearning/iconografia_sap_abap/lastpost_anim.gif);
	}

.ptabulador_flecha_marron_anim{
	background-image:url(/cvo_files/img_sistema_elearning/iconografia_sap_abap/lastpost_marron_anim.gif);
	}

.ptabulador_flecha_gris_anim{
	background-image:url(/cvo_files/img_sistema_elearning/iconografia_sap_abap/lastpost_off_anim.gif);
	}

/* Red de nodos a todo el ancho de la pagina: la imagen va en ::before, que se estira a 100vw desde el centro
   del bloque (el body ya tiene overflow-x:hidden, no genera scroll). isolation:isolate deja la imagen por
   encima del fondo y por debajo del texto. Imagen fija, sin animacion */
.fondo_onda{
	border-radius: 20px;
	position: relative;
	isolation: isolate;
	padding-bottom:100px;
	}

.fondo_onda::before{
	content:"";
	position:absolute;
	top:0;
	bottom:0;
	left:50%;
	width:100vw;
	margin-left:-50vw;
	z-index:-1;
	pointer-events:none;
	/*background-image:url(/cvo_files/img_sistema_elearning/iconografia_sap_abap/svg/red_nodos.svg);*/
	/*background-image:url(/cvo_files/img_sistema_elearning/iconografia_sap_abap/svg/red_nodos_malla.svg);*/
	background-image:url(/cvo_files/img_sistema_elearning/iconografia_sap_abap/svg/red_nodos_malla2.svg);
	background-repeat:no-repeat;
	background-position:bottom center;
	background-size:100% auto;
	}

/* HUB (maestro y de area): BANDA DE CABECERA A TODO EL ANCHO   -> IA-CHG-CLAUDE | ID: 30OCT2026-13:50:00 | HUB BANDA CABECERA
   index.php envuelve la cabecera del hub (titulo, texto y tarjeta) en .cvohub_hero. El fondo de color va en ::before, estirado
   a 100vw desde el centro (como .fondo_onda; el body tiene overflow-x:hidden). Las solapas del hub (primera section que sigue)
   continuan la banda y terminan con la red de nodos y un desvanecimiento hacia la pagina. La tarjeta del titulo pierde el
   borde: blanca, sombra difusa, esquinas redondeadas y acento lateral dorado-azul
   PALETA (30OCT2026-14:20:00 | HUB BANDA AMARILLO TARJETA): activa la AMARILLA. Para probar la CELESTE, en cada linea marcada
   "PALETA" comentar la amarilla y descomentar la celeste que esta debajo (5 lineas: banda, fondo y degrade de las solapas,
   fondo y sombra de la tarjeta)
   PAGINAS DE CURSO Y CARRERA (30OCT2026-15:50:00 | BANDA CABECERA CURSO Y CARRERA): la misma banda; ahi el bloque que sigue a la cabecera es
   #div_head_2.fondo_onda (duracion, modalidad, ...), que toma el fondo, la red de nodos y el desvanecimiento de las solapas del hub */
.cvohub_hero{
	position:relative;
	isolation:isolate;
	padding:26px 0 6px 0;
	}

.cvohub_hero::before{
	content:"";
	position:absolute;
	/* sube 0.5em para tapar el padding superior de #div_pagina_cont_central (la franja gris entre el menu y la banda) */   /* -> IA-CHG-CLAUDE | ID: 30OCT2026-14:15:00 | HUB BANDA SIN FRANJA SUPERIOR */
	top:-0.5em;   /* -> IA-CHG-CLAUDE | ID: 30OCT2026-14:15:00 | HUB BANDA SIN FRANJA SUPERIOR */
	/* -> IA-CHG-OFF | CLAUDE | ID: 30OCT2026-14:15:00 | top:0; */
	bottom:0;
	left:50%;
	width:100vw;
	margin-left:-50vw;
	z-index:-1;
	pointer-events:none;
	background:linear-gradient(180deg, #fffefa 0%, #fffbee 55%, #fef7e0 100%);   /* PALETA amarilla */   /* -> IA-CHG-CLAUDE | ID: 30OCT2026-14:20:00 | HUB BANDA AMARILLO TARJETA */
	/* PALETA celeste: background:linear-gradient(180deg, #f9fcff 0%, #f1f7fd 55%, #eaf3fc 100%); */
	/* -> IA-CHG-OFF | CLAUDE | ID: 30OCT2026-14:05:00 | background:linear-gradient(180deg, #f3f8fd 0%, #e6f1fb 55%, #dcecf9 100%); */
	}

.cvohub_hero + section,
.cvohub_hero + p + section,   /* -> IA-CHG-OFF | CLAUDE | ID: 30OCT2026-15:50:00 | antes cerraba aqui con { */
.cvohub_hero + .fondo_onda,   /* -> IA-CHG-CLAUDE | ID: 30OCT2026-15:50:00 | BANDA CABECERA CURSO Y CARRERA */
.cvohub_hero + p + .fondo_onda{   /* -> IA-CHG-CLAUDE | ID: 30OCT2026-15:50:00 | BANDA CABECERA CURSO Y CARRERA */
	position:relative;
	isolation:isolate;
	padding-bottom:240px;   /* -> IA-CHG-CLAUDE | ID: 30OCT2026-14:05:00 | HUB BANDA AMARILLO */
	/* -> IA-CHG-OFF | CLAUDE | ID: 30OCT2026-14:05:00 | padding-bottom:150px; */
	}

/* Curso y carrera: el margen del primer elemento de #div_head_2 se escapaba hacia arriba y dejaba una franja blanca
   entre la cabecera y los datos; flow-root lo deja adentro, bajo el fondo   -> IA-CHG-CLAUDE | ID: 30OCT2026-15:50:00 | BANDA CABECERA CURSO Y CARRERA */
.cvohub_hero + .fondo_onda,
.cvohub_hero + p + .fondo_onda{
	display:flow-root;
	}

.cvohub_hero + section::before,
.cvohub_hero + p + section::before,   /* -> IA-CHG-OFF | CLAUDE | ID: 30OCT2026-15:50:00 | antes cerraba aqui con { */
.cvohub_hero + .fondo_onda::before,   /* -> IA-CHG-CLAUDE | ID: 30OCT2026-15:50:00 | BANDA CABECERA CURSO Y CARRERA */
.cvohub_hero + p + .fondo_onda::before{   /* -> IA-CHG-CLAUDE | ID: 30OCT2026-15:50:00 | BANDA CABECERA CURSO Y CARRERA */
	content:"";
	position:absolute;
	top:0;
	bottom:0;
	left:50%;
	width:100vw;
	margin-left:-50vw;
	z-index:-1;
	pointer-events:none;
	background-color:#fef7e0;   /* PALETA amarilla */   /* -> IA-CHG-CLAUDE | ID: 30OCT2026-14:20:00 | HUB BANDA AMARILLO TARJETA */
	/* PALETA celeste: background-color:#eaf3fc; */
	/* -> IA-CHG-OFF | CLAUDE | ID: 30OCT2026-14:05:00 | background-color:#dcecf9; */
	background-image:url(/cvo_files/img_sistema_elearning/iconografia_sap_abap/svg/red_nodos_malla2.svg), linear-gradient(180deg, #fef7e0 0%, #fffcf3 100%);   /* PALETA amarilla */   /* -> IA-CHG-CLAUDE | ID: 30OCT2026-14:20:00 | HUB BANDA AMARILLO TARJETA */
	/* PALETA celeste: background-image:url(/cvo_files/img_sistema_elearning/iconografia_sap_abap/svg/red_nodos_malla2.svg), linear-gradient(180deg, #eaf3fc 0%, #f5f9fe 100%); */
	/* -> IA-CHG-OFF | CLAUDE | ID: 30OCT2026-14:05:00 | background-image:url(/cvo_files/img_sistema_elearning/iconografia_sap_abap/svg/red_nodos_malla2.svg), linear-gradient(180deg, #dcecf9 0%, #eef5fc 100%); */
	background-repeat:no-repeat, no-repeat;
	background-position:center bottom 95px, center;   /* -> IA-CHG-CLAUDE | ID: 30OCT2026-14:05:00 | HUB BANDA AMARILLO */
	/* -> IA-CHG-OFF | CLAUDE | ID: 30OCT2026-14:05:00 | background-position:center bottom 60px, center; */
	background-size:100% auto, 100% 100%;
	-webkit-mask-image:linear-gradient(180deg, #000 0%, #000 calc(100% - 300px), rgba(0,0,0,0.8) calc(100% - 190px), rgba(0,0,0,0.35) calc(100% - 80px), transparent 100%);   /* -> IA-CHG-CLAUDE | ID: 30OCT2026-14:05:00 | HUB BANDA AMARILLO */
	/* -> IA-CHG-OFF | CLAUDE | ID: 30OCT2026-14:05:00 | -webkit-mask-image:linear-gradient(180deg, #000 0%, #000 calc(100% - 170px), rgba(0,0,0,0.55) calc(100% - 85px), transparent 100%); */
	mask-image:linear-gradient(180deg, #000 0%, #000 calc(100% - 300px), rgba(0,0,0,0.8) calc(100% - 190px), rgba(0,0,0,0.35) calc(100% - 80px), transparent 100%);   /* -> IA-CHG-CLAUDE | ID: 30OCT2026-14:05:00 | HUB BANDA AMARILLO */
	/* -> IA-CHG-OFF | CLAUDE | ID: 30OCT2026-14:05:00 | mask-image:linear-gradient(180deg, #000 0%, #000 calc(100% - 170px), rgba(0,0,0,0.55) calc(100% - 85px), transparent 100%); */
	}

.cvohub_hero #header_ppal_desktop{
	position:relative;
	background:#ffffff;
	background-image:none;   /* PALETA amarilla */   /* -> IA-CHG-CLAUDE | ID: 30OCT2026-14:20:00 | HUB BANDA AMARILLO TARJETA */
	/* PALETA celeste: background-image:linear-gradient(120deg, #ffffff 0%, #ffffff 55%, #f2f8fe 100%); */
	border:0;
	border-radius:16px;
	box-shadow:0 16px 38px rgba(160,120,10,0.16), 0 2px 6px rgba(160,120,10,0.08), 0 0 0 1px rgba(214,170,60,0.20);   /* PALETA amarilla */   /* -> IA-CHG-CLAUDE | ID: 30OCT2026-14:20:00 | HUB BANDA AMARILLO TARJETA */
	/* PALETA celeste: box-shadow:0 14px 34px rgba(14,103,168,0.12), 0 2px 6px rgba(14,103,168,0.06); */
	overflow:hidden;
	padding-left:1.6em;
	}

.cvohub_hero #header_ppal_desktop::before{
	content:"";
	position:absolute;
	left:0;
	top:0;
	bottom:0;
	width:6px;
	background:linear-gradient(180deg, #f6c119 0%, #0c6db3 100%);
	}

.cvohub_hero #header_ppal_desktop #div_breadcrumb{
	background:transparent;
	border-top:1px solid #eef2f6;
	margin-left:-1.6em;
	padding-left:1.35em;
	}
/* FIN HUB BANDA DE CABECERA   -> IA-CHG-CLAUDE | ID: 30OCT2026-13:50:00 | HUB BANDA CABECERA */

/* PREGUNTAS FRECUENTES (hub y pagina de carrera, getMensajeFaqContenedor): la pregunta del accordion queda pegada al
   borde izquierdo de la caja gris; se le da aire a los costados (las carreras cross training ya lo traen en linea)   -> IA-CHG-CLAUDE | ID: 30OCT2026-14:50:00 | FAQ PREGUNTA CON AIRE */
.div_accordion[id^="div_accordion_hubfaq_"] h3,
.div_accordion[id^="div_accordion_carrfaq_"] h3{
	padding-left:16px;
	padding-right:16px;
	}

/* En celular la pregunta heredaba margin-top de 2em (46px) y quedaba un hueco gris arriba del texto: margen parejo
   arriba y abajo   -> IA-CHG-CLAUDE | ID: 30OCT2026-16:05:00 | FAQ MOVIL SIN ESPACIO */
@media (max-width: 768px){
	.div_accordion[id^="div_accordion_hubfaq_"] h3,
	.div_accordion[id^="div_accordion_carrfaq_"] h3{
		margin-top:0.6em !important;
		margin-bottom:0.6em !important;
		}
	}

/* La caja de la respuesta es inline-block (en linea desde plan_carrera.class.php) y con un texto corto quedaba angosta:
   ocupa todo el ancho de la pregunta menos sus margenes de 10px   -> IA-CHG-CLAUDE | ID: 30OCT2026-16:15:00 | FAQ RESPUESTA ANCHO COMPLETO */
.div_accordion_element[id^="div_accordion_hubfaq_"],
.div_accordion_element[id^="div_accordion_carrfaq_"]{
	box-sizing:border-box;
	width:calc(100% - 20px);
	}
/* FIN PREGUNTAS FRECUENTES   -> IA-CHG-CLAUDE | ID: 30OCT2026-14:50:00 | FAQ PREGUNTA CON AIRE */

/* CARRUSEL DE EMPRESAS (carrusel_empresas.class.php)   -> IA-CHG-CLAUDE | ID: 30OCT2026-15:05:00 | CARRUSEL EMPRESAS TRAZABLE
   cvo_carrusel_doble: la lista de logos viene dos veces seguidas y la animacion avanza la mitad (una lista entera), asi
   la vuelta empalma sin el hueco vacio del final. Se detiene con el mouse encima para poder leer los logos.
   cvo_carrusel_banda (solo cierre de pagina): banda gris a todo el ancho (::before a 100vw, como .cvohub_hero); el
   contenido queda al ancho de la pagina. Cabecera con sello de trazabilidad, texto y boton al portfolio */
.slider ul.cvo_carrusel_doble{
	animation:cvo_carrusel_loop 26s linear infinite;
	}

.slider:hover ul.cvo_carrusel_doble{
	animation-play-state:paused;
	}

@keyframes cvo_carrusel_loop{
	from{
		transform:translateX(0);
		}
	to{
		transform:translateX(-50%);
		}
	}

.cvo_carrusel_banda{
	position:relative;
	isolation:isolate;
	margin-top:4em;
	padding:2.4em 0 2.2em 0;
	text-align:center;
	}

.cvo_carrusel_banda::before{
	content:"";
	position:absolute;
	top:0;
	bottom:0;
	left:50%;
	width:100vw;
	margin-left:-50vw;
	z-index:-1;
	pointer-events:none;
	background:linear-gradient(180deg, #f3f4f5 0%, #eceef1 100%);
	border-top:1px solid #dde1e5;
	border-bottom:1px solid #dde1e5;
	box-shadow:inset 0 10px 18px -14px rgba(0,0,0,0.18), inset 0 -10px 18px -14px rgba(0,0,0,0.18);
	}

/* Los logos aparecen y se van con un desvanecido en los costados */
.cvo_carrusel_banda .slider{
	-webkit-mask-image:linear-gradient(90deg, transparent 0%, #000 6%, #000 94%, transparent 100%);
	mask-image:linear-gradient(90deg, transparent 0%, #000 6%, #000 94%, transparent 100%);
	}

.cvo_carrusel_cabecera{
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:1.4em;
	margin:0 0 1.8em 0;
	text-align:left;
	}

.cvo_carrusel_sello{
	flex:0 0 auto;
	display:inline-block;
	padding:0.45em 1em;
	font-size:0.85em;
	font-weight:700;
	letter-spacing:0.04em;
	text-transform:uppercase;
	white-space:nowrap;
	color:#0e67a8;
	background:#ffffff;
	border:2px solid #0e67a8;
	border-radius:2em;
	}

.cvo_carrusel_textos{
	flex:1 1 auto;
	}

p.cvo_carrusel_titulo{
	margin:0 0 0.25em 0;
	font-size:1.3em;
	line-height:1.3;
	color:#1d2a36;
	}

p.cvo_carrusel_titulo strong{
	color:#0e67a8;
	}

p.cvo_carrusel_bajada{
	margin:0;
	color:#55606b;
	}

a.cvo_carrusel_boton{
	flex:0 0 auto;
	display:inline-block;
	padding:0.75em 1.4em;
	font-size:15px;
	font-weight:700;
	white-space:nowrap;
	color:#ffffff !important;
	text-decoration:none;
	background-color:#0e67a8;
	border-radius:2em;
	box-shadow:0 4px 12px rgba(14,103,168,0.25);
	-webkit-transition:.2s;
	-moz-transition:.2s;
	transition:.2s;
	}

a.cvo_carrusel_boton:hover{
	color:#17466e !important;
	background-color:#f6c119;
	}

@media (max-width: 900px){
	.cvo_carrusel_cabecera{
		flex-direction:column;
		text-align:center;
		gap:0.9em;
		}

	.cvo_carrusel_cabecera p.cvo_carrusel_titulo,
	.cvo_carrusel_cabecera p.cvo_carrusel_bajada{
		text-align:center;
		}
	}
/* FIN CARRUSEL DE EMPRESAS   -> IA-CHG-CLAUDE | ID: 30OCT2026-15:05:00 | CARRUSEL EMPRESAS TRAZABLE */

/* PAGINAS DE CURSO Y CARRERA EN CELULAR: sin scroll horizontal   -> IA-CHG-CLAUDE | ID: 30OCT2026-15:55:00 | CURSO SIN SCROLL HORIZONTAL MOVIL
   Los h2 de las secciones (Presentacion, Contenidos, Instructor, Pago e Inscripcion, Preguntas frecuentes) traen en linea
   min-width:400px desde plan_carrera.class.php; con el padding miden 417px y en pantallas angostas empujaban la pagina
   41px a la derecha. Debajo de 480px se anula ese minimo (sin regenerar nada). El recuadro de testimonios (95% + padding +
   borde + margen) se pasaba 1px: cuenta el padding y el borde dentro de su ancho */
@media (max-width: 480px){
	h2[style*="min-width:400px"]{
		min-width:0 !important;
		}

	#testimoniales{
		box-sizing:border-box;
		}
	}
/* FIN PAGINAS DE CURSO Y CARRERA EN CELULAR   -> IA-CHG-CLAUDE | ID: 30OCT2026-15:55:00 | CURSO SIN SCROLL HORIZONTAL MOVIL */

/* CABECERA MOVIL EN CARRERAS Y HUBS (hasta 910px, donde se ve la cabecera movil)   -> IA-CHG-CLAUDE | ID: 30OCT2026-16:45:00 | CABECERA MOVIL SECCIONES
   functiones_genericas.js pone cvo_movil_secciones en <html> cuando la pagina tiene secciones (carrera o hub) y agrega a
   la barra de secciones el boton #cvo_movil_menu (hamburguesa + heraldica, abre el menu lateral) y la linea dorada
   #cvo_movil_sep. En celular y tablet esa barra ocupa toda la cabecera movil, siempre a la vista, en lugar del logo, el
   texto CVOSOFT y el gif del menu. z-index 100 como la cabecera: la barra va despues en el documento y queda encima;
   el menu desplegado (101) queda encima de las dos. En PC el boton y la linea no se ven */
#cvo_movil_menu,
#cvo_movil_sep,
#cvo_movil_marca{   /* -> IA-CHG-CLAUDE | ID: 30OCT2026-20:10:00 | CABECERA MOVIL DESDE EL SERVIDOR */
	display:none;
	}

@media all and (max-width: 910px){
	/* Cabecera movil (page.class.php la manda asi desde el servidor): boton de menu, linea dorada y CVOSOFT, a 8px del
	   borde, en el mismo lugar donde despues queda el boton dentro de la barra   -> IA-CHG-CLAUDE | ID: 30OCT2026-20:10:00 | CABECERA MOVIL DESDE EL SERVIDOR */
	html #div_nav_ppal_movil{
		display:flex;
		align-items:center;
		box-sizing:border-box;
		height:59px;   /* 56px de contenido + 3px de la linea dorada: mismo centro que la barra */
		padding:0 0 0 8px;
		}

	#cvo_movil_marca{
		display:inline-block;
		margin-left:2px;
		font-family:arial, sans-serif;
		font-size:20px;
		font-weight:bold;
		letter-spacing:0.5px;
		color:#0c6db3 !important;
		text-decoration:none !important;
		text-shadow:1px 1px 0 #ffffff, 2px 2px 2px #d5d6d7;
		}

	html.cvo_movil_secciones #div_nav_ppal_movil{
		min-height:56px;
		}

	html.cvo_movil_secciones .cvo_barra_secciones{
		display:flex !important;
		align-items:center;
		top:0 !important;
		left:0;
		right:0;
		height:56px;
		z-index:100;
		padding:0 0 0 8px;
		opacity:1;
		visibility:visible;
		-webkit-transform:none;
		transform:none;
		background-color:#ffffff;
		background-image:none;
		border-bottom:0;
		box-shadow:none;
		}

	/* Hubs (sin boton de inscripcion): el ultimo item se desvanece a la derecha para indicar que la barra se desliza.
	   Navegadores sin :has() ignoran la regla y la barra queda igual, sin desvanecido */
	html.cvo_movil_secciones .cvo_barra_secciones:not(:has(.cvo_barra_cta)):not(:has(.cvo_barra_vertodos)){   /* -> IA-CHG-CLAUDE | ID: 30OCT2026-20:00:00 | VER TODOS MOVIL (sin desvanecido si hay Ver todos) */
		-webkit-mask-image:linear-gradient(90deg, #000 0%, #000 calc(100% - 28px), transparent 100%);
		mask-image:linear-gradient(90deg, #000 0%, #000 calc(100% - 28px), transparent 100%);
		}

	/* Boton de menu: caja clara con borde y sombra suaves (mismo modelo que la barra movil de ADM, RED e INS) */
	#cvo_movil_menu{   /* -> IA-CHG-CLAUDE | ID: 30OCT2026-20:10:00 | CABECERA MOVIL DESDE EL SERVIDOR (antes con html.cvo_movil_secciones delante) */
		flex:0 0 auto;
		display:inline-flex;
		align-items:center;
		gap:3px;
		height:40px;
		padding:0 7px 0 4px !important;
		text-decoration:none !important;
		background-color:#f4f8fc;
		border:1px solid rgba(15, 23, 42, 0.12) !important;
		border-radius:11px;
		box-shadow:0 1px 3px rgba(15, 23, 42, 0.12);
		-webkit-tap-highlight-color:transparent;
		}

	#cvo_movil_menu:active{   /* -> IA-CHG-CLAUDE | ID: 30OCT2026-20:10:00 | CABECERA MOVIL DESDE EL SERVIDOR (antes con html.cvo_movil_secciones delante) */
		background-color:#ffffff;
		-webkit-transform:scale(0.96);
		transform:scale(0.96);
		}

	/* Tres puntos verticales (como el menu de Chrome), dibujados con CSS: redondos y nitidos en cualquier pantalla y sin
	   depender de la fuente (el caracter \22EE queda en el HTML, oculto con font-size 0) */
	.cvo_movil_menu_ico{   /* -> IA-CHG-CLAUDE | ID: 30OCT2026-20:10:00 | CABECERA MOVIL DESDE EL SERVIDOR (antes con html.cvo_movil_secciones delante) */
		display:block;
		width:12px;
		height:21px;
		font-size:0;
		background-image:radial-gradient(circle at center, #0e67a8 0, #0e67a8 2px, transparent 2.4px);
		background-size:12px 7px;
		background-repeat:repeat-y;
		background-position:center top;
		}

	.cvo_movil_menu_escudo{   /* -> IA-CHG-CLAUDE | ID: 30OCT2026-20:10:00 | CABECERA MOVIL DESDE EL SERVIDOR (antes con html.cvo_movil_secciones delante) */
		display:block;
		width:26px;
		height:26px;
		}

	#cvo_movil_sep{   /* -> IA-CHG-CLAUDE | ID: 30OCT2026-20:10:00 | CABECERA MOVIL DESDE EL SERVIDOR (antes con html.cvo_movil_secciones delante) */
		display:block;
		flex:0 0 auto;
		width:2px;
		height:28px;
		margin:0 6px 0 8px;
		border-radius:2px;
		background-color:#f6c119;
		}

	html.cvo_movil_secciones .cvo_barra_int{
		flex:1 1 auto;
		min-width:0;
		height:100%;
		max-width:none;
		margin:0;
		gap:0.35em;
		padding:0 0 0 0.1em;
		}

	html.cvo_movil_secciones .cvo_barra_titulo,
	html.cvo_movil_secciones a.cvo_barra_hub{
		display:none;
		}

	/* Secciones como botones: pildoras grises; la seccion que se esta leyendo, en azul */
	html.cvo_movil_secciones a.cvo_barra_item{
		font-size:13.5px;
		line-height:1.2em;
		padding:0.5em 0.8em;
		color:#3d4650 !important;
		background-color:#eef1f4;
		border:1px solid #dde2e7;
		border-radius:2em;
		}

	html.cvo_movil_secciones a.cvo_barra_item.cvo_nav_activo{
		color:#0e67a8 !important;
		background-color:#e6f1fb;
		border-color:#0e67a8;
		}

	/* Inscripcion siempre a la vista: si las secciones no entran (carreras con Modulos, celulares chicos) queda fija a
	   la derecha y las demas se deslizan por debajo; el halo blanco a su izquierda marca el corte */
	html.cvo_movil_secciones a.cvo_barra_item.cvo_barra_cta{
		position:-webkit-sticky;
		position:sticky;
		right:8px;
		margin-left:auto;
		margin-right:8px;
		/* halo a la izquierda y franja blanca a la derecha: tapan lo que se desliza por debajo */
		box-shadow:-12px 0 10px 2px #ffffff, 12px 0 0 4px #ffffff;
		padding:0.5em 1em;
		font-weight:700;
		color:#17466e !important;
		background-color:#f6c119;
		border-color:#f6c119;
		}

	html.cvo_movil_secciones a.cvo_barra_item.cvo_barra_cta.cvo_nav_activo{
		background-color:#f6c119;
		border-color:#c9960c;
		}
	}
/* FIN CABECERA MOVIL EN CARRERAS Y HUBS   -> IA-CHG-CLAUDE | ID: 30OCT2026-16:45:00 | CABECERA MOVIL SECCIONES */

/* BOTON "VER TODOS" EN LA CABECERA MOVIL   -> IA-CHG-CLAUDE | ID: 30OCT2026-20:00:00 | VER TODOS MOVIL
   functiones_genericas.js agrega a.cvo_barra_vertodos (al hub maestro) en los hubs de area y en el resto del sitio. En
   PC no se ve (ahi esta el boton gris de siempre). En celular y tablet queda fijo a la derecha, azul con letras blancas,
   como Inscripcion en la carrera: los accesos se deslizan por debajo y el halo blanco marca el corte */
a.cvo_barra_item.cvo_barra_vertodos{
	display:none;
	}

@media all and (max-width: 910px){
	html.cvo_movil_secciones a.cvo_barra_item.cvo_barra_vertodos{
		display:inline-block;
		position:-webkit-sticky;
		position:sticky;
		right:8px;
		margin-left:auto;
		margin-right:8px;
		padding:0.5em 1em;
		font-weight:700;
		color:#ffffff !important;
		background-color:#0e67a8;
		border-color:#0e67a8;
		box-shadow:-12px 0 10px 2px #ffffff, 12px 0 0 4px #ffffff;
		}

	html.cvo_movil_secciones a.cvo_barra_item.cvo_barra_vertodos:active{
		background-color:#0b5a93;
		}
	}
/* FIN BOTON VER TODOS   -> IA-CHG-CLAUDE | ID: 30OCT2026-20:00:00 | VER TODOS MOVIL */

/* TARJETA DEL TITULO EN CELULAR Y TABLET: HERALDICA + TITULO   -> IA-CHG-CLAUDE | ID: 30OCT2026-20:15:00 | CABECERA PAGINA MOVIL CON HERALDICA
   En todas las paginas con #header_ppal_desktop (hubs, cursos, carreras, empresas, portfolio, ...). Hasta 910px el logo
   grande de la columna izquierda (cvosoft_logo.svg o logo_cvo_academy_it.png) no se muestra: el titulo lleva delante
   la misma heraldica del boton de menu (favicon_v4/favicon.svg, 1,7 KB, nitida en cualquier pantalla). En PC no cambia */
@media all and (max-width: 910px){
	#header_ppal_desktop .div_fila_2cols_img_izq-col_izquierda{
		display:none !important;
		}

	#header_ppal_desktop h1::before{
		content:"";
		display:inline-block;
		width:1.15em;
		height:1.15em;
		margin:0 0.35em 0 0;
		vertical-align:-0.18em;
		background-image:url(/cvo_files/imgs_sap_abap/logos/favicon_v4/favicon.svg);
		background-repeat:no-repeat;
		background-position:center;
		background-size:contain;
		}
	}
/* FIN TARJETA DEL TITULO EN CELULAR   -> IA-CHG-CLAUDE | ID: 30OCT2026-20:15:00 | CABECERA PAGINA MOVIL CON HERALDICA */

/* MENU LATERAL: TITULO CON HERALDICA + "MENU CVOSOFT"   -> IA-CHG-CLAUDE | ID: 30OCT2026-20:30:00 | MENU LATERAL HERALDICA
   El titulo del panel (span.cvomenu_head_titulo de func_menu_pagina.php, texto "Menu") se arma con CSS: el texto
   original queda en tamanio 0 y en su lugar va la heraldica del boton de menu (favicon_v4/favicon.svg) seguida de
   "MENU CVOSOFT" (mayusculas por text-transform). Sin tocar el PHP; vale en todas las paginas */
.cvomenu_head_titulo{
	font-size:0 !important;
	white-space:nowrap;
	}

.cvomenu_head_titulo::before{
	content:"";
	display:inline-block;
	width:24px;
	height:24px;
	margin:0 8px 0 0;
	vertical-align:middle;
	background-image:url(/cvo_files/imgs_sap_abap/logos/favicon_v4/favicon.svg);
	background-repeat:no-repeat;
	background-position:center;
	background-size:contain;
	}

.cvomenu_head_titulo::after{
	content:"Men\00FA  CVOSOFT";
	display:inline-block;
	vertical-align:middle;
	font-size:12px;
	letter-spacing:0.15em;
	}
/* FIN MENU LATERAL: TITULO   -> IA-CHG-CLAUDE | ID: 30OCT2026-20:30:00 | MENU LATERAL HERALDICA */

/* MENU DE SECCIONES EN TARJETA SOBRE LA RED DE NODOS (carrera y hubs)   -> IA-CHG-CLAUDE | ID: 30OCT2026-18:35:00 | CARRERA MENU EN TARJETA
   -> IA-CHG-CLAUDE | ID: 30OCT2026-18:55:00 | MENU EN TARJETA GRIS Y HUBS: tarjeta gris neutra, tambien en los hubs
   Carrera: el menu (Presentacion ... Inscripcion) va al final del bloque de datos (#div_head_2.fondo_onda). Hub: las
   solapas (nav#div_encabezados) al principio de la primera section. En los dos va dentro de una tarjeta gris clara con
   borde suave, brillo arriba y sombra neutra, para que no se mezcle con la red de nodos; la red baja hasta el borde
   inferior de la banda, la banda es mas corta y el primer titulo que sigue sube */
.cvohub_hero + .fondo_onda,
.cvohub_hero + p + .fondo_onda,
.cvohub_hero + section,
.cvohub_hero + p + section{
	padding-bottom:185px;   /* -> IA-CHG-CLAUDE | ID: 30OCT2026-19:05:00 | TARJETA TRANSPARENTE Y RED MAS ABAJO (antes 130px) */
	}

.cvohub_hero + .fondo_onda::before,
.cvohub_hero + p + .fondo_onda::before,
.cvohub_hero + section::before,
.cvohub_hero + p + section::before{
	background-position:center bottom 0, center;
	/* la red se ve entera: el desvanecimiento empieza mas abajo y es mas corto   -> IA-CHG-CLAUDE | ID: 30OCT2026-19:05:00 | TARJETA TRANSPARENTE Y RED MAS ABAJO */
	-webkit-mask-image:linear-gradient(180deg, #000 0%, #000 calc(100% - 110px), rgba(0,0,0,0.6) calc(100% - 50px), transparent 100%);
	mask-image:linear-gradient(180deg, #000 0%, #000 calc(100% - 110px), rgba(0,0,0,0.6) calc(100% - 50px), transparent 100%);
	}

.fondo_onda > nav.cvo_nav_secciones_carrera,
.cvohub_hero + section > nav.cvohub_solapas,
.cvohub_hero + p + section > nav.cvohub_solapas{
	box-sizing:border-box;
	width:-webkit-fit-content;
	width:-moz-fit-content;
	width:fit-content;
	max-width:100%;
	margin:2.5em auto 0 auto;
	padding:0.8em 1.1em;
	background-color:rgba(240, 240, 240, 0.62);   /* -> IA-CHG-CLAUDE | ID: 30OCT2026-19:05:00 | TARJETA TRANSPARENTE Y RED MAS ABAJO (antes 0.94) */
	-webkit-backdrop-filter:blur(2px);   /* -> IA-CHG-CLAUDE | ID: 30OCT2026-19:05:00 | TARJETA TRANSPARENTE Y RED MAS ABAJO (antes 6px) */
	backdrop-filter:blur(2px);   /* -> IA-CHG-CLAUDE | ID: 30OCT2026-19:05:00 | TARJETA TRANSPARENTE Y RED MAS ABAJO (antes 6px) */
	border:1px solid #e0e0e0;
	border-radius:16px;
	box-shadow:inset 0 1px 0 rgba(255, 255, 255, 0.8), 0 10px 26px rgba(0, 0, 0, 0.10), 0 2px 6px rgba(0, 0, 0, 0.05);
	}

/* Hub: el margen de las solapas (lo primero de la section) se escapaba hacia arriba y dejaba una franja blanca entre
   la cabecera y la section; flow-root lo deja adentro, bajo el fondo */
.cvohub_hero + section,
.cvohub_hero + p + section{
	display:flow-root;
	}

/* Hub: las solapas son lo primero de la section, menos aire arriba */
.cvohub_hero + section > nav.cvohub_solapas,
.cvohub_hero + p + section > nav.cvohub_solapas{
	margin-top:1.5em;
	}

.cvohub_hero + .fondo_onda + h2,
.cvohub_hero + p + .fondo_onda + h2{
	margin-top:1em !important;
	}

@media all and (max-width: 767px){
	/* En el celular las secciones bajan de linea dentro de la tarjeta (todas a la vista, Inscripcion incluida) */
	.fondo_onda > nav.cvo_nav_secciones_carrera,
	.cvohub_hero + section > nav.cvohub_solapas,
	.cvohub_hero + p + section > nav.cvohub_solapas{
		flex-wrap:wrap;
		justify-content:center;
		overflow:visible;
		margin-top:2em;
		padding:0.7em 0.6em;
		}

	.cvohub_hero + section > nav.cvohub_solapas,
	.cvohub_hero + p + section > nav.cvohub_solapas{
		margin-top:1em;
		}

	.cvohub_hero + .fondo_onda,
	.cvohub_hero + p + .fondo_onda,
	.cvohub_hero + section,
	.cvohub_hero + p + section{
		padding-bottom:90px;   /* -> IA-CHG-CLAUDE | ID: 30OCT2026-19:05:00 | TARJETA TRANSPARENTE Y RED MAS ABAJO (antes 60px) */
		}
	}
/* FIN MENU DE SECCIONES EN TARJETA   -> IA-CHG-CLAUDE | ID: 30OCT2026-18:35:00 | CARRERA MENU EN TARJETA */

/* BARRA FIJA: FARO AL PRINCIPIO (carreras, hubs y resto del sitio)   -> IA-CHG-CLAUDE | ID: 30OCT2026-19:35:00 | BARRA FARO
   functiones_genericas.js agrega span.cvo_barra_puntos con 4 <i> al principio de la barra. Dibujo: i:1 punto azul de
   8px; i:2 el mismo punto en dorado encima (invisible); i:3 una onda dorada de 14px que llega desde afuera, se cierra
   sobre el punto y lo enciende: el punto crece un poco y se ve dorado un instante (i:2 aparece y se va con opacidad,
   sin cambiar colores, para no repintar). Ciclo de 3,4 s. Solo transform y opacity (lo resuelve la placa de video);
   se frena con la barra oculta y queda quieto para quien pidio menos movimiento */
.cvo_barra_puntos{
	position:relative;
	flex:0 0 auto;
	display:inline-block;
	width:14px;
	height:14px;
	/* -> IA-CHG-OFF | CLAUDE | ID: 31OCT2026-01:50:00 | margin:0 0.15em 0 0; */
	margin:0 calc(0.15em + 4px) 0 4px;   /* -> IA-CHG-CLAUDE | ID: 31OCT2026-01:55:00 | FARO 50 POR CIENTO MAS GRANDE (4px por lado para lo que crece; antes 2px) */
	-webkit-transform:scale(1.5);   /* -> IA-CHG-CLAUDE | ID: 31OCT2026-01:55:00 | FARO 50 POR CIENTO MAS GRANDE: se agranda entero (punto, onda y variantes; antes 1.3) */
	transform:scale(1.5);   /* -> IA-CHG-CLAUDE | ID: 31OCT2026-01:55:00 | FARO 50 POR CIENTO MAS GRANDE (antes 1.3) */
	}

.cvo_barra_puntos i{
	position:absolute;
	left:3px;
	top:3px;
	width:8px;
	height:8px;
	border-radius:50%;
	background-color:#0e67a8;
	-webkit-animation:cvo_faro_late 3.4s ease-in-out infinite;
	animation:cvo_faro_late 3.4s ease-in-out infinite;
	}

.cvo_barra_puntos i:nth-child(2){
	background-color:#f6c119;
	opacity:0;
	-webkit-animation-name:cvo_faro_enciende;
	animation-name:cvo_faro_enciende;
	}

.cvo_barra_puntos i:nth-child(3){
	left:0;
	top:0;
	width:14px;
	height:14px;
	background-color:transparent;
	box-shadow:0 0 0 1.5px #f6c119 inset;
	opacity:0;
	-webkit-animation:cvo_faro_cierra 3.4s ease-in infinite;
	animation:cvo_faro_cierra 3.4s ease-in infinite;
	}

.cvo_barra_puntos i:nth-child(4){
	display:none;
	}

/* Con la barra oculta, o con el menu de la pagina fuera de pantalla, el faro no gasta nada */
.cvo_barra_secciones:not(.cvo_barra_visible) .cvo_barra_puntos i,
.cvo_faro_quieto i{   /* -> IA-CHG-CLAUDE | ID: 30OCT2026-19:40:00 | FARO EN MENU DE PAGINA */
	-webkit-animation-play-state:paused;
	animation-play-state:paused;
	}

@-webkit-keyframes cvo_faro_cierra{
	0%{ -webkit-transform:scale(1.35); opacity:0; }
	15%{ opacity:0.8; }
	45%{ -webkit-transform:scale(0.4); opacity:0; }
	100%{ -webkit-transform:scale(0.4); opacity:0; }
	}

@keyframes cvo_faro_cierra{
	0%{ transform:scale(1.35); opacity:0; }
	15%{ opacity:0.8; }
	45%{ transform:scale(0.4); opacity:0; }
	100%{ transform:scale(0.4); opacity:0; }
	}

@-webkit-keyframes cvo_faro_late{
	0%, 40%{ -webkit-transform:scale(1); }
	50%{ -webkit-transform:scale(1.35); }
	75%, 100%{ -webkit-transform:scale(1); }
	}

@keyframes cvo_faro_late{
	0%, 40%{ transform:scale(1); }
	50%{ transform:scale(1.35); }
	75%, 100%{ transform:scale(1); }
	}

@-webkit-keyframes cvo_faro_enciende{
	0%, 40%{ -webkit-transform:scale(1); opacity:0; }
	50%{ -webkit-transform:scale(1.35); opacity:1; }
	75%, 100%{ -webkit-transform:scale(1); opacity:0; }
	}

@keyframes cvo_faro_enciende{
	0%, 40%{ transform:scale(1); opacity:0; }
	50%{ transform:scale(1.35); opacity:1; }
	75%, 100%{ transform:scale(1); opacity:0; }
	}

/* En el celular, en carreras y hubs, la barra va en la cabecera y no lleva titulo: tampoco faro */
@media all and (max-width: 910px){
	html.cvo_movil_secciones .cvo_barra_secciones .cvo_barra_puntos{   /* -> IA-CHG-CLAUDE | ID: 30OCT2026-19:40:00 | FARO EN MENU DE PAGINA (solo la barra; el del menu de la pagina se ve) */
		display:none;
		}
	}

/* Faro en el menu de la pagina (tarjeta gris de la carrera y solapas del hub): centrado con los botones; el espacio
   lo da el gap del menu   -> IA-CHG-CLAUDE | ID: 30OCT2026-19:40:00 | FARO EN MENU DE PAGINA */
.cvo_faro_pagina{
	align-self:center;
	/* -> IA-CHG-OFF | CLAUDE | ID: 31OCT2026-01:50:00 | margin:0 0.1em 0 0.2em; */
	margin:0 calc(0.1em + 4px) 0 calc(0.2em + 4px);   /* -> IA-CHG-CLAUDE | ID: 31OCT2026-01:55:00 | FARO 50 POR CIENTO MAS GRANDE (antes 2px) */
	}

/* Menos movimiento: el punto azul quieto, sin onda */
@media (prefers-reduced-motion: reduce){
	.cvo_barra_puntos i{
		-webkit-animation:none;
		animation:none;
		}

	.cvo_barra_puntos i:nth-child(2),
	.cvo_barra_puntos i:nth-child(3){
		display:none;
		}
	}
/* FIN BARRA FIJA: FARO   -> IA-CHG-CLAUDE | ID: 30OCT2026-19:35:00 | BARRA FARO */

/* BARRA FIJA: GALERIA DE FAROS (uno al azar en cada carga)   -> IA-CHG-CLAUDE | ID: 31OCT2026-01:40:00 | FARO GALERIA AL AZAR
   functiones_genericas.js sortea una de 7 variantes por pagina y le pone la clase al faro de la barra y al del menu de
   la pagina (los dos iguales). Sin clase queda el faro invertido de arriba. Todas con los mismos 4 <i>, 14px, azul
   #0e67a8 y dorado #f6c119, y solo transform y opacity:
     cvo_faro_giro                     F. Destello que gira: al encenderse, un arco dorado da una vuelta alrededor
     cvo_faro_nx cvo_faro_orbita       H. Orbita: una lunita dorada da vueltas lentas alrededor del punto
     cvo_faro_nx cvo_faro_gota         J. Gota: cae una gota dorada, aplasta un poco el punto y deja una onda
     cvo_faro_nx cvo_faro_guino        K. Guino: ojito con pupila dorada que mira a los lados y parpadea dos veces
     cvo_faro_nx cvo_faro_gemelos      L. Gemelos: el punto se divide en uno azul y uno dorado y se vuelven a fundir
     cvo_faro_nx cvo_faro_saltito      N. Saltito: saltito suave con sombra dorada que se achica en el aire
   cvo_faro_nx apaga el faro invertido y deja el punto azul solo; cada variante prende los <i> que usa */

/* F. Destello que gira (se suma al faro invertido: usa el 4to <i>) */
.cvo_barra_puntos.cvo_faro_giro i:nth-child(4){
	display:block;
	left:-2px;
	top:-2px;
	width:18px;
	height:18px;
	background:conic-gradient(from 0deg, rgba(246,193,25,0) 0deg, rgba(246,193,25,0.95) 70deg, rgba(246,193,25,0) 110deg, rgba(246,193,25,0) 360deg);
	-webkit-mask:radial-gradient(circle, transparent 5.5px, #000 6px);
	mask:radial-gradient(circle, transparent 5.5px, #000 6px);
	opacity:0;
	-webkit-animation:cvo_faro_vuelta 3.4s ease-in-out infinite;
	animation:cvo_faro_vuelta 3.4s ease-in-out infinite;
	}

@-webkit-keyframes cvo_faro_vuelta{
	0%, 46%{ -webkit-transform:rotate(0deg); opacity:0; }
	52%{ opacity:1; }
	80%{ -webkit-transform:rotate(360deg); opacity:0.8; }
	88%, 100%{ -webkit-transform:rotate(360deg); opacity:0; }
	}

@keyframes cvo_faro_vuelta{
	0%, 46%{ transform:rotate(0deg); opacity:0; }
	52%{ opacity:1; }
	80%{ transform:rotate(360deg); opacity:0.8; }
	88%, 100%{ transform:rotate(360deg); opacity:0; }
	}

/* Base de las variantes nuevas: solo el punto azul, quieto */
.cvo_barra_puntos.cvo_faro_nx i{
	display:block;
	left:3px;
	top:3px;
	width:8px;
	height:8px;
	border-radius:50%;
	background:#0e67a8;
	box-shadow:none;
	opacity:1;
	-webkit-transform:none;
	transform:none;
	-webkit-animation:none;
	animation:none;
	}

.cvo_barra_puntos.cvo_faro_nx i:nth-child(n+2){
	display:none;
	}

/* H. Orbita */
.cvo_barra_puntos.cvo_faro_orbita i:nth-child(1){
	left:4px;
	top:4px;
	width:6px;
	height:6px;
	}

.cvo_barra_puntos.cvo_faro_orbita i:nth-child(2){
	display:block;
	left:0;
	top:0;
	width:14px;
	height:14px;
	border-radius:0;
	background:radial-gradient(circle at 50% 1.7px, #f6c119 1.6px, rgba(246,193,25,0) 2.1px);
	-webkit-animation:cvo_faro_orbita 4.2s linear infinite;
	animation:cvo_faro_orbita 4.2s linear infinite;
	}

.cvo_barra_puntos.cvo_faro_orbita i:nth-child(3){
	display:block;
	left:1.6px;
	top:1.6px;
	width:10.8px;
	height:10.8px;
	background:transparent;
	box-shadow:0 0 0 0.8px rgba(14,103,168,0.18) inset;
	}

@-webkit-keyframes cvo_faro_orbita{
	0%{ -webkit-transform:rotate(0deg); }
	100%{ -webkit-transform:rotate(360deg); }
	}

@keyframes cvo_faro_orbita{
	0%{ transform:rotate(0deg); }
	100%{ transform:rotate(360deg); }
	}

/* J. Gota */
.cvo_barra_puntos.cvo_faro_gota i:nth-child(1){
	-webkit-transform-origin:50% 100%;
	transform-origin:50% 100%;
	-webkit-animation:cvo_faro_gota_aplasta 3.6s ease-out infinite;
	animation:cvo_faro_gota_aplasta 3.6s ease-out infinite;
	}

.cvo_barra_puntos.cvo_faro_gota i:nth-child(2){
	display:block;
	left:5.5px;
	top:5.5px;
	width:3px;
	height:3px;
	background:#f6c119;
	-webkit-animation:cvo_faro_gota_cae 3.6s ease-in infinite;
	animation:cvo_faro_gota_cae 3.6s ease-in infinite;
	}

.cvo_barra_puntos.cvo_faro_gota i:nth-child(3){
	display:block;
	left:0;
	top:0;
	width:14px;
	height:14px;
	background:transparent;
	box-shadow:0 0 0 1.2px #f6c119 inset;
	-webkit-animation:cvo_faro_gota_onda 3.6s ease-out infinite;
	animation:cvo_faro_gota_onda 3.6s ease-out infinite;
	}

@-webkit-keyframes cvo_faro_gota_cae{
	0%{ -webkit-transform:translateY(-10px); opacity:0; }
	8%{ opacity:1; }
	30%{ -webkit-transform:translateY(-2px); opacity:1; }
	32%, 100%{ -webkit-transform:translateY(0); opacity:0; }
	}

@keyframes cvo_faro_gota_cae{
	0%{ transform:translateY(-10px); opacity:0; }
	8%{ opacity:1; }
	30%{ transform:translateY(-2px); opacity:1; }
	32%, 100%{ transform:translateY(0); opacity:0; }
	}

@-webkit-keyframes cvo_faro_gota_aplasta{
	0%, 30%{ -webkit-transform:scale(1, 1); }
	34%{ -webkit-transform:scale(1.2, 0.78); }
	42%{ -webkit-transform:scale(0.95, 1.06); }
	50%, 100%{ -webkit-transform:scale(1, 1); }
	}

@keyframes cvo_faro_gota_aplasta{
	0%, 30%{ transform:scale(1, 1); }
	34%{ transform:scale(1.2, 0.78); }
	42%{ transform:scale(0.95, 1.06); }
	50%, 100%{ transform:scale(1, 1); }
	}

@-webkit-keyframes cvo_faro_gota_onda{
	0%, 31%{ -webkit-transform:scale(0.5); opacity:0; }
	34%{ opacity:0.85; }
	70%{ -webkit-transform:scale(1.5); opacity:0; }
	100%{ -webkit-transform:scale(1.5); opacity:0; }
	}

@keyframes cvo_faro_gota_onda{
	0%, 31%{ transform:scale(0.5); opacity:0; }
	34%{ opacity:0.85; }
	70%{ transform:scale(1.5); opacity:0; }
	100%{ transform:scale(1.5); opacity:0; }
	}

/* K. Guino */
.cvo_barra_puntos.cvo_faro_guino i:nth-child(1){
	-webkit-animation:cvo_faro_guino_parpado 4.6s ease-in-out infinite;
	animation:cvo_faro_guino_parpado 4.6s ease-in-out infinite;
	}

.cvo_barra_puntos.cvo_faro_guino i:nth-child(2){
	display:block;
	left:5.5px;
	top:5.5px;
	width:3px;
	height:3px;
	background:#f6c119;
	-webkit-animation:cvo_faro_guino_mira 4.6s ease-in-out infinite;
	animation:cvo_faro_guino_mira 4.6s ease-in-out infinite;
	}

@-webkit-keyframes cvo_faro_guino_parpado{
	0%, 60%{ -webkit-transform:scaleY(1); }
	63%{ -webkit-transform:scaleY(0.1); }
	66%, 70%{ -webkit-transform:scaleY(1); }
	73%{ -webkit-transform:scaleY(0.1); }
	76%, 100%{ -webkit-transform:scaleY(1); }
	}

@keyframes cvo_faro_guino_parpado{
	0%, 60%{ transform:scaleY(1); }
	63%{ transform:scaleY(0.1); }
	66%, 70%{ transform:scaleY(1); }
	73%{ transform:scaleY(0.1); }
	76%, 100%{ transform:scaleY(1); }
	}

@-webkit-keyframes cvo_faro_guino_mira{
	0%, 10%{ -webkit-transform:translateX(0); opacity:1; }
	20%, 35%{ -webkit-transform:translateX(-1.6px); opacity:1; }
	45%, 55%{ -webkit-transform:translateX(1.6px); opacity:1; }
	60%{ -webkit-transform:translateX(0); opacity:1; }
	62%{ opacity:0; }
	66%{ opacity:1; }
	71%{ opacity:0; }
	75%, 100%{ -webkit-transform:translateX(0); opacity:1; }
	}

@keyframes cvo_faro_guino_mira{
	0%, 10%{ transform:translateX(0); opacity:1; }
	20%, 35%{ transform:translateX(-1.6px); opacity:1; }
	45%, 55%{ transform:translateX(1.6px); opacity:1; }
	60%{ transform:translateX(0); opacity:1; }
	62%{ opacity:0; }
	66%{ opacity:1; }
	71%{ opacity:0; }
	75%, 100%{ transform:translateX(0); opacity:1; }
	}

/* L. Gemelos */
.cvo_barra_puntos.cvo_faro_gemelos i:nth-child(1){
	left:4px;
	top:4px;
	width:6px;
	height:6px;
	-webkit-animation:cvo_faro_gemelo_izq 4.4s ease-in-out infinite;
	animation:cvo_faro_gemelo_izq 4.4s ease-in-out infinite;
	}

.cvo_barra_puntos.cvo_faro_gemelos i:nth-child(2){
	display:block;
	left:4px;
	top:4px;
	width:6px;
	height:6px;
	background:#f6c119;
	-webkit-animation:cvo_faro_gemelo_der 4.4s ease-in-out infinite;
	animation:cvo_faro_gemelo_der 4.4s ease-in-out infinite;
	}

@-webkit-keyframes cvo_faro_gemelo_izq{
	0%, 15%{ -webkit-transform:translateX(0); }
	45%, 60%{ -webkit-transform:translateX(-3.2px); }
	90%, 100%{ -webkit-transform:translateX(0); }
	}

@keyframes cvo_faro_gemelo_izq{
	0%, 15%{ transform:translateX(0); }
	45%, 60%{ transform:translateX(-3.2px); }
	90%, 100%{ transform:translateX(0); }
	}

@-webkit-keyframes cvo_faro_gemelo_der{
	0%, 15%{ -webkit-transform:translateX(0); opacity:0; }
	25%{ opacity:1; }
	45%, 60%{ -webkit-transform:translateX(3.2px); opacity:1; }
	82%{ opacity:1; }
	90%, 100%{ -webkit-transform:translateX(0); opacity:0; }
	}

@keyframes cvo_faro_gemelo_der{
	0%, 15%{ transform:translateX(0); opacity:0; }
	25%{ opacity:1; }
	45%, 60%{ transform:translateX(3.2px); opacity:1; }
	82%{ opacity:1; }
	90%, 100%{ transform:translateX(0); opacity:0; }
	}

/* N. Saltito */
.cvo_barra_puntos.cvo_faro_saltito i:nth-child(1){
	left:3.5px;
	top:3.5px;
	width:7px;
	height:7px;
	-webkit-transform-origin:50% 100%;
	transform-origin:50% 100%;
	-webkit-animation:cvo_faro_salto 2.8s ease-in-out infinite;
	animation:cvo_faro_salto 2.8s ease-in-out infinite;
	}

.cvo_barra_puntos.cvo_faro_saltito i:nth-child(2){
	display:block;
	left:3px;
	top:11.5px;
	width:8px;
	height:2px;
	background:#f6c119;
	opacity:0.55;
	-webkit-animation:cvo_faro_sombra 2.8s ease-in-out infinite;
	animation:cvo_faro_sombra 2.8s ease-in-out infinite;
	}

@-webkit-keyframes cvo_faro_salto{
	0%{ -webkit-transform:translateY(0) scale(1, 1); }
	8%{ -webkit-transform:translateY(0) scale(1.15, 0.82); }
	24%{ -webkit-transform:translateY(-4px) scale(0.94, 1.08); }
	40%{ -webkit-transform:translateY(0) scale(1.15, 0.85); }
	48%, 100%{ -webkit-transform:translateY(0) scale(1, 1); }
	}

@keyframes cvo_faro_salto{
	0%{ transform:translateY(0) scale(1, 1); }
	8%{ transform:translateY(0) scale(1.15, 0.82); }
	24%{ transform:translateY(-4px) scale(0.94, 1.08); }
	40%{ transform:translateY(0) scale(1.15, 0.85); }
	48%, 100%{ transform:translateY(0) scale(1, 1); }
	}

@-webkit-keyframes cvo_faro_sombra{
	0%, 8%{ -webkit-transform:scaleX(1); opacity:0.55; }
	24%{ -webkit-transform:scaleX(0.55); opacity:0.25; }
	40%{ -webkit-transform:scaleX(1.1); opacity:0.6; }
	48%, 100%{ -webkit-transform:scaleX(1); opacity:0.55; }
	}

@keyframes cvo_faro_sombra{
	0%, 8%{ transform:scaleX(1); opacity:0.55; }
	24%{ transform:scaleX(0.55); opacity:0.25; }
	40%{ transform:scaleX(1.1); opacity:0.6; }
	48%, 100%{ transform:scaleX(1); opacity:0.55; }
	}

/* Las variantes tambien se frenan con la barra oculta o con el menu de la pagina fuera de pantalla (las reglas de
   arriba quedan debajo en peso, por eso el !important) */
.cvo_barra_secciones:not(.cvo_barra_visible) .cvo_barra_puntos i,
.cvo_faro_quieto i{
	-webkit-animation-play-state:paused !important;
	animation-play-state:paused !important;
	}

/* Menos movimiento: en cualquier variante, el punto azul quieto y nada mas */
@media (prefers-reduced-motion: reduce){
	.cvo_barra_puntos i{
		-webkit-animation:none !important;
		animation:none !important;
		}

	.cvo_barra_puntos i:nth-child(n+2){
		display:none !important;
		}
	}
/* FIN BARRA FIJA: GALERIA DE FAROS   -> IA-CHG-CLAUDE | ID: 31OCT2026-01:40:00 | FARO GALERIA AL AZAR */

/* FICHA DE LA CARRERA COMO RECORRIDO DEL ALUMNO   -> IA-CHG-CLAUDE | ID: 31OCT2026-02:30:00 | FICHA RECORRIDO
   plan_carrera.class.php (definicionPaginaFicha) arma ol.cvo_recorrido: un li por paso (empiezas, cursas, practicas, te
   acompana, te certificas, te preparas, inversion) con span.cvo_recorrido_paso (rotulo) y div.cvo_recorrido_det (texto).
   Linea dorada de un punto al otro (fondo de cada li menos el ultimo) y punto de faro: aro dorado (::before) con el punto
   azul adentro (::after). Mismo cuerpo de letra que las lineas de antes (1.125em) */
#div_ficha_carrera .cvo_recorrido{
	list-style:none;
	/* -> IA-CHG-OFF | CLAUDE | ID: 31OCT2026-03:05:00 | margin:0.5em 8px 0.8em 8px; */
	margin:0.5em 8px 2.4em 8px;   /* -> IA-CHG-CLAUDE | ID: 31OCT2026-03:05:00 | FICHA AIRE ANTES DEL MENU: separacion tranquila con el menu de secciones (antes 0.8em) */
	padding:0;
	}

#div_ficha_carrera .cvo_recorrido li{
	position:relative;
	margin:0;
	padding:0 0 1.1em 40px;
	font-size:1.125em;
	line-height:1.6;
	color:#4a4a4a;
	}

#div_ficha_carrera .cvo_recorrido li:not(:last-child){
	background:linear-gradient(#f6c119, #f6c119) 11px 13px / 2px 100% no-repeat;
	}

#div_ficha_carrera .cvo_recorrido li:last-child{
	padding-bottom:0;
	}

#div_ficha_carrera .cvo_recorrido li::before{
	content:"";
	position:absolute;
	z-index:1;
	left:4px;
	top:1px;
	width:16px;
	height:16px;
	border-radius:50%;
	background-color:#ffffff;
	box-shadow:0 0 0 2px #f6c119 inset;
	}

#div_ficha_carrera .cvo_recorrido li::after{
	content:"";
	position:absolute;
	z-index:1;
	left:8px;
	top:5px;
	width:8px;
	height:8px;
	border-radius:50%;
	background-color:#0e67a8;
	}

.cvo_recorrido_paso{
	display:block;
	font-size:12px;
	font-weight:700;
	letter-spacing:0.08em;
	line-height:18px;
	text-transform:uppercase;
	color:#0e67a8;
	}

.cvo_recorrido_det strong{
	color:#2b3238;
	}

/* Titulacion multiple (Doble, Triple...): pildora dorada al lado del certificado */
.cvo_recorrido_titulacion{
	display:inline-block;
	margin-left:4px;
	padding:0 10px;
	border-radius:2em;
	background-color:#fff3c4;
	color:#7a5a00;
	font-size:0.8em;
	font-weight:700;
	line-height:1.7;
	white-space:nowrap;
	}

/* Inversion: caja azul. El precio trae spans con color en linea (planes continua y prepaga): en blanco sobre el azul */
.cvo_recorrido_meta{
	display:inline-block;
	margin-top:4px;
	padding:8px 14px;
	border-radius:10px;
	background-color:#0e67a8;
	color:#ffffff;
	font-size:1.1em;
	font-weight:700;
	line-height:1.4;
	}

.cvo_recorrido_meta span{
	color:#ffffff !important;
	}

/* Bonificacion de los planes de carrera: recuadro dorado destacado debajo de la caja azul   -> IA-CHG-CLAUDE | ID: 31OCT2026-03:00:00 | FICHA BONIFICACION DESTACADA */
.cvo_recorrido_bonif{
	display:table;
	margin-top:10px;
	padding:6px 14px 6px 12px;
	border-left:4px solid #f6c119;
	border-radius:0 10px 10px 0;
	background-color:#fff3c4;
	color:#5c4600;
	font-size:0.92em;
	line-height:1.45;
	}

.cvo_recorrido_bonif strong{
	color:#2b3238;
	}

/* Cuotas segun el pais (AR, MX, CO): renglon debajo de la caja azul   -> IA-CHG-CLAUDE | ID: 31OCT2026-02:50:00 | FICHA CUOTAS DEBAJO DEL PRECIO */
.cvo_recorrido_nota{
	display:block;
	margin-top:6px;
	font-size:0.85em;
	line-height:1.45;
	color:#4a4a4a;
	}
/* FIN FICHA DE LA CARRERA COMO RECORRIDO   -> IA-CHG-CLAUDE | ID: 31OCT2026-02:30:00 | FICHA RECORRIDO */

/* PAGO E INSCRIPCION: PLANES EN TARJETAS   -> IA-CHG-CLAUDE | ID: 31OCT2026-03:15:00 | PAGO E INSCRIPCION EN TARJETAS
   Color de los botones con !important: la regla general "#div_pagina_cont_central a" (con id) les ganaba y los dejaba en gris
   plan_carrera.class.php (getPlanesTarjetas) arma div.cvo_planes: tira de inicio, bajada, grilla con dos tarjetas
   (Prepaga destacada con cinta "Mas elegido" y Continua) o una sola (cvo_planes_uno), y el pie con las cuotas segun el
   pais y el sello. En celular y tablet las tarjetas van una debajo de la otra */
.cvo_planes{
	margin:0.5em 0 1.5em 0;
	font-size:16px;
	}

.cvo_planes_tira{
	display:flex;
	flex-wrap:wrap;
	align-items:center;
	gap:8px 16px;
	margin:0 0 18px 0;
	padding:10px 16px;
	border-radius:10px;
	background-color:#fff3c4;
	color:#5c4600;
	font-weight:600;
	}

.cvo_planes_punto{
	width:10px;
	height:10px;
	border-radius:50%;
	background-color:#1f8a4c;
	box-shadow:0 0 0 4px rgba(31,138,76,0.18);
	}

.cvo_planes_sep{
	width:1px;
	height:16px;
	background-color:rgba(92,70,0,0.25);
	}

.cvo_planes_bajada{
	margin:0 0 22px 0;
	color:#4a4a4a;
	}

.cvo_planes_grilla{
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:20px;
	align-items:stretch;
	}

.cvo_planes_uno{
	grid-template-columns:minmax(0, 520px);
	justify-content:center;
	}

.cvo_plan{
	position:relative;
	display:flex;
	flex-direction:column;
	gap:14px;
	min-width:0;
	padding:26px 24px 22px 24px;
	border-radius:16px;
	border:1px solid #e3e6ea;
	background-color:#ffffff;
	box-shadow:0 10px 30px rgba(20,40,70,0.08);
	text-align:left;
	}

.cvo_plan_prepaga{
	border:2px solid #6d4fd6;
	box-shadow:0 14px 36px rgba(109,79,214,0.18);
	}

.cvo_plan_cinta{
	position:absolute;
	top:-13px;
	left:24px;
	padding:3px 12px;
	border-radius:2em;
	background-color:#6d4fd6;
	color:#ffffff;
	font-size:12px;
	font-weight:700;
	letter-spacing:0.06em;
	text-transform:uppercase;
	}

.cvo_plan_nombre{
	font-size:13px;
	font-weight:700;
	letter-spacing:0.08em;
	text-transform:uppercase;
	color:#0e67a8;
	}

.cvo_plan_prepaga .cvo_plan_nombre{
	color:#6d4fd6;
	}

.cvo_plan_precio{
	display:flex;
	flex-wrap:wrap;
	align-items:baseline;
	gap:8px;
	}

.cvo_plan_precio b{
	font-size:42px;
	line-height:1;
	letter-spacing:-0.01em;
	color:#2b3238;
	}

.cvo_plan_precio span{
	color:#6b7279;
	}

.cvo_plan_resumen{
	margin:0;
	font-size:15px;
	line-height:1.5;
	color:#4a4a4a;
	}

.cvo_plan_lista{
	list-style:none;
	flex:1 1 auto;
	display:grid;
	align-content:start;
	gap:10px;
	margin:0;
	padding:14px 0 0 0;
	border-top:1px dashed #e3e6ea;
	}

.cvo_plan_lista li{
	display:flex;
	align-items:flex-start;
	gap:10px;
	margin:0;
	padding:0;
	font-size:15px;
	line-height:1.5;
	color:#4a4a4a;
	background:none;
	}

.cvo_plan_lista strong{
	color:#2b3238;
	}

.cvo_plan_tilde{
	flex:0 0 auto;
	width:18px;
	height:18px;
	margin-top:3px;
	fill:none;
	stroke:#1f8a4c;
	stroke-width:2.2;
	stroke-linecap:round;
	stroke-linejoin:round;
	}

.cvo_plan_off{
	display:inline-block;
	padding:0 7px;
	border-radius:6px;
	background-color:#fff3c4;
	color:#5c4600;
	font-weight:700;
	}

a.cvo_plan_btn{
	display:flex;
	justify-content:center;
	align-items:center;
	margin-top:6px;
	padding:13px 20px;
	border-radius:10px;
	border-bottom:0;
	font-size:16px;
	font-weight:700;
	line-height:1.3;
	text-align:center;
	text-decoration:none;
	-webkit-transition:-webkit-transform 0.15s ease, box-shadow 0.15s ease;
	transition:transform 0.15s ease, box-shadow 0.15s ease;
	}

a.cvo_plan_btn:hover{
	-webkit-transform:translateY(-1px);
	transform:translateY(-1px);
	text-decoration:none;
	}

a.cvo_plan_btn_violeta{
	background-color:#6d4fd6;
	color:#ffffff !important;
	box-shadow:0 6px 16px rgba(109,79,214,0.28);
	}

a.cvo_plan_btn_azul{
	background-color:#0e67a8;
	color:#ffffff !important;
	box-shadow:0 6px 16px rgba(14,103,168,0.25);
	}

a.cvo_plan_btn_borde{
	background-color:#ffffff;
	color:#0e67a8 !important;
	box-shadow:inset 0 0 0 2px #0e67a8;
	}

a.cvo_plan_btn_violeta:hover,
a.cvo_plan_btn_azul:hover,
a.cvo_plan_btn_borde:hover{
	color:#ffffff !important;
	}

a.cvo_plan_btn_borde:hover{
	background-color:#0e67a8;
	}

.cvo_planes_pie{
	margin:18px 0 0 0;
	text-align:center;
	font-size:14px;
	color:#6b7279;
	}

.cvo_planes_pie_sep{
	margin:0 4px;
	}

.cvo_planes_sello{
	display:inline-block;
	padding:2px 10px;
	border-radius:2em;
	background-color:#e6f6ec;
	color:#1f8a4c;
	font-size:13.5px;
	font-weight:700;
	white-space:nowrap;
	}

@media all and (max-width: 860px){
	.cvo_planes_grilla{
		grid-template-columns:1fr;
		gap:26px;
		}
	}

@media all and (max-width: 480px){
	.cvo_plan{
		padding:24px 18px 20px 18px;
		}

	.cvo_plan_precio b{
		font-size:36px;
		}
	}
/* FIN PAGO E INSCRIPCION: PLANES EN TARJETAS   -> IA-CHG-CLAUDE | ID: 31OCT2026-03:15:00 | PAGO E INSCRIPCION EN TARJETAS */

/* PAGO E INSCRIPCION: BANDA AZUL A TODO EL ANCHO   -> IA-CHG-CLAUDE | ID: 31OCT2026-03:25:00 | PAGO E INSCRIPCION BANDA AZUL
   section.cvo_planes_banda envuelve la seccion en la pagina de la carrera. El fondo (::before) se estira a 100vw desde el
   centro, como las otras bandas (el body tiene overflow-x:hidden): degrade azul CVOSOFT y dos anillos dorados arriba a la
   derecha dibujados con radial-gradient (no son imagenes). Cabecera centrada: aviso de inicio en dorado, h2 en blanco y
   la bajada; las tarjetas blancas flotan con sombra y la Prepaga lleva aro y cinta dorados */
.cvo_planes_banda{
	position:relative;
	isolation:isolate;
	margin:4em 0 2em 0;
	padding:64px 0 68px 0;
	}

.cvo_planes_banda::before{
	content:"";
	position:absolute;
	top:0;
	bottom:0;
	left:50%;
	width:100vw;
	margin-left:-50vw;
	z-index:-1;
	background:
		radial-gradient(circle at calc(100% + 60px) -60px, transparent 0, transparent 268px, rgba(246,193,25,0.35) 269px, rgba(246,193,25,0.35) 271px, transparent 272px),
		radial-gradient(circle at calc(100% + 60px) -60px, transparent 0, transparent 168px, rgba(246,193,25,0.5) 169px, rgba(246,193,25,0.5) 171px, transparent 172px),
		radial-gradient(1200px 500px at 20% 0%, #1b78bd 0%, rgba(27,120,189,0) 60%),
		linear-gradient(160deg, #0a4f82 0%, #0e67a8 55%, #155f98 100%);
	}

.cvo_planes_cabeza{
	max-width:760px;
	margin:0 auto 30px auto;
	padding:0 16px;
	text-align:center;
	}

.cvo_planes_eyebrow{
	display:block;
	margin-bottom:8px;
	font-size:12.5px;
	font-weight:700;
	letter-spacing:0.12em;
	text-transform:uppercase;
	color:#f6c119;
	}

.cvo_planes_banda h2.cvo_planes_titulo{
	display:block;
	margin:0;
	padding:0;
	border:0;
	border-radius:0;
	background:none;
	font-size:2em;
	line-height:1.15;
	font-weight:700;
	text-align:center;
	color:#ffffff;
	}

.cvo_planes_banda .cvo_planes_bajada{
	margin:10px auto 0 auto;
	max-width:60ch;
	font-size:1.05em;
	line-height:1.55;
	text-align:center;
	color:#d6e6f4;
	}

.cvo_planes_area{
	padding:0 8px;
	}

.cvo_planes_banda .cvo_planes{
	margin:0;
	}

.cvo_planes_banda .cvo_plan{
	border-color:transparent;
	box-shadow:0 20px 44px rgba(0,20,50,0.35);
	}

.cvo_planes_banda .cvo_plan_prepaga{
	border:2px solid #f6c119;
	box-shadow:0 0 0 4px rgba(246,193,25,0.25), 0 20px 44px rgba(0,20,50,0.35);
	}

.cvo_planes_banda .cvo_plan_cinta{
	background-color:#f6c119;
	color:#3a2c00;
	}

.cvo_planes_banda .cvo_planes_pie{
	color:#d6e6f4;
	}

@media all and (max-width: 860px){
	.cvo_planes_banda{
		padding:48px 0 52px 0;
		}

	.cvo_planes_banda h2.cvo_planes_titulo{
		font-size:1.6em;
		}

	/* En celular los anillos cruzaban el titulo: solo el degrade */
	.cvo_planes_banda::before{
		background:
			radial-gradient(600px 300px at 20% 0%, #1b78bd 0%, rgba(27,120,189,0) 60%),
			linear-gradient(160deg, #0a4f82 0%, #0e67a8 55%, #155f98 100%);
		}
	}
/* FIN PAGO E INSCRIPCION: BANDA AZUL   -> IA-CHG-CLAUDE | ID: 31OCT2026-03:25:00 | PAGO E INSCRIPCION BANDA AZUL */

/* MODELO ACADEMICO EN TARJETAS DESPLEGABLES   -> IA-CHG-CLAUDE | ID: 31OCT2026-03:50:00 | MODELO ACADEMICO DESPLEGABLE
   carrera_v2.class.php (getTextoAllInclusive v2) arma div.cvo_modelo: cabecera (texto y sello dorado ALL-INCLUSIVE),
   tres pilares en <details> (abre el primero) con las etiquetas de sus items y el detalle al desplegar, y la banda azul
   de cierre. Sin JavaScript: el desplegable es nativo del navegador */
.cvo_modelo{
	font-size:16px;
	}

.cvo_modelo_cab{
	display:grid;
	grid-template-columns:1fr auto;
	gap:18px 28px;
	align-items:center;
	margin:0 0 26px 0;
	}

.cvo_modelo_eyebrow{
	display:block;
	font-size:12.5px;
	font-weight:700;
	letter-spacing:0.12em;
	text-transform:uppercase;
	color:#0e67a8;
	}

.cvo_modelo h3.cvo_modelo_titulo{
	margin:4px 0 12px 0;
	padding:0;
	border:0;
	font-size:1.9em;
	line-height:1.15;
	font-weight:700;
	text-align:left;
	color:#2b3238;
	}

.cvo_modelo p.cvo_modelo_parrafo{
	margin:0 0 8px 0;
	max-width:70ch;
	font-size:1.05em;
	line-height:1.6;
	}

.cvo_modelo_sello{
	display:grid;
	place-items:center;
	width:132px;
	height:132px;
	border-radius:50%;
	text-align:center;
	line-height:1.05;
	font-weight:700;
	color:#3a2c00;
	background:radial-gradient(circle at 30% 25%, #ffe27a 0%, #f6c119 55%, #d9a40c 100%);
	box-shadow:0 0 0 6px #ffffff, 0 0 0 7px #f3d77a, 0 14px 30px rgba(160,120,10,0.25);
	}

.cvo_modelo_sello small{
	display:block;
	font-size:11px;
	letter-spacing:0.1em;
	text-transform:uppercase;
	}

.cvo_modelo_sello b{
	display:block;
	font-size:20px;
	letter-spacing:0.02em;
	}

.cvo_modelo_pilares{
	display:grid;
	gap:14px;
	}

.cvo_modelo_pilar{
	border:1px solid #e3e6ea;
	border-radius:16px;
	background-color:#ffffff;
	overflow:hidden;
	}

.cvo_modelo_pilar[open]{
	border-color:#cfdbe7;
	box-shadow:0 12px 30px rgba(20,40,70,0.08);
	}

.cvo_modelo_pilar > summary{
	list-style:none;
	display:grid;
	grid-template-columns:auto 1fr auto;
	gap:16px;
	align-items:center;
	padding:18px 20px;
	cursor:pointer;
	}

.cvo_modelo_pilar > summary::-webkit-details-marker{
	display:none;
	}

.cvo_modelo_pilar > summary:focus-visible{
	outline:2px solid #f6c119;
	outline-offset:-2px;
	}

.cvo_modelo_ico{
	display:grid;
	place-items:center;
	width:52px;
	height:52px;
	border-radius:14px;
	background-color:#e8f1f9;
	color:#0e67a8;
	}

.cvo_modelo_ico svg{
	width:26px;
	height:26px;
	fill:none;
	stroke:currentColor;
	stroke-width:1.8;
	stroke-linecap:round;
	stroke-linejoin:round;
	}

.cvo_modelo_sum_txt{
	display:block;
	min-width:0;
	}

.cvo_modelo_pilar_titulo{
	display:block;
	font-size:19px;
	font-weight:700;
	line-height:1.3;
	color:#2b3238;
	}

.cvo_modelo_chips{
	display:flex;
	flex-wrap:wrap;
	gap:6px;
	margin-top:6px;
	}

.cvo_modelo_chips span{
	padding:2px 10px;
	border-radius:2em;
	background-color:#f1f3f6;
	font-size:13px;
	font-weight:600;
	color:#4a4a4a;
	}

.cvo_modelo_mas{
	display:flex;
	align-items:center;
	gap:8px;
	font-size:14px;
	font-weight:700;
	white-space:nowrap;
	color:#0e67a8;
	}

.cvo_modelo_mas::after{
	content:"";
	width:9px;
	height:9px;
	margin-top:-4px;
	border-right:2px solid currentColor;
	border-bottom:2px solid currentColor;
	-webkit-transform:rotate(45deg);
	transform:rotate(45deg);
	-webkit-transition:-webkit-transform 0.2s ease;
	transition:transform 0.2s ease;
	}

.cvo_modelo_pilar[open] .cvo_modelo_mas::after{
	margin-top:4px;
	-webkit-transform:rotate(-135deg);
	transform:rotate(-135deg);
	}

.cvo_modelo_cuerpo{
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:0 28px;
	padding:4px 20px 20px 88px;
	}

.cvo_modelo_item{
	padding:10px 0;
	border-top:1px solid #e3e6ea;
	font-size:15px;
	line-height:1.55;
	color:#4a4a4a;
	}

.cvo_modelo_item strong{
	color:#2b3238;
	}

/* Enlaces del detalle en azul (la regla general "#div_pagina_cont_central a" los dejaba en gris) */
.cvo_modelo_item a{
	color:#0e67a8 !important;
	text-decoration:none;
	border-bottom:1.5px solid #f3d77a;
	}

.cvo_modelo_cierre{
	display:flex;
	flex-wrap:wrap;
	justify-content:space-between;
	align-items:center;
	gap:12px 20px;
	margin-top:26px;
	padding:16px 20px;
	border-radius:12px;
	background:linear-gradient(90deg, #0b5a93, #0e67a8);
	color:#ffffff;
	font-size:15px;
	}

.cvo_modelo_cierre strong{
	color:#f6c119;
	}

.cvo_modelo_cierre_links{
	display:flex;
	flex-wrap:wrap;
	gap:8px 18px;
	}

/* Con !important: la regla general "#div_pagina_cont_central a" (con id) los dejaba en gris */
.cvo_modelo_cierre a{
	color:#ffffff !important;
	font-weight:600;
	text-decoration:none;
	border-bottom:1.5px solid rgba(246,193,25,0.7);
	}

.cvo_modelo_cierre a:hover{
	color:#f6c119 !important;
	}

@media all and (max-width: 640px){
	.cvo_modelo_cab{
		grid-template-columns:1fr;
		}

	.cvo_modelo_sello{
		width:96px;
		height:96px;
		justify-self:center;
		}

	.cvo_modelo_sello b{
		font-size:16px;
		}

	.cvo_modelo h3.cvo_modelo_titulo{
		font-size:1.55em;
		}

	.cvo_modelo_pilar > summary{
		grid-template-columns:auto 1fr;
		align-items:start;
		gap:12px;
		padding:16px;
		}

	.cvo_modelo_ico{
		width:40px;
		height:40px;
		border-radius:11px;
		}

	.cvo_modelo_ico svg{
		width:22px;
		height:22px;
		}

	.cvo_modelo_pilar_titulo{
		font-size:17px;
		}

	.cvo_modelo_mas{
		grid-column:1 / -1;
		}

	.cvo_modelo_cuerpo{
		grid-template-columns:1fr;
		padding:4px 16px 16px 16px;
		}
	}
/* FIN MODELO ACADEMICO EN TARJETAS DESPLEGABLES   -> IA-CHG-CLAUDE | ID: 31OCT2026-03:50:00 | MODELO ACADEMICO DESPLEGABLE */

/* TEMARIO DESDE LA BASE: BANDA AZUL A TODO EL ANCHO   -> IA-CHG-CLAUDE | ID: 31OCT2026-04:40:00 | TEMARIO DESDE LA BASE
   carrera_v2.class.php (defCarreraTemarioHtml) arma section#cvo_temario en Contenidos, en lugar del temario en PDF:
   cabecera (titulo y cifras), un nivel por columna (cvo_temario_n1, n2, n3...) y cada unidad como fila desplegable
   (<details>, sin JavaScript) con su descripcion y lecciones. El fondo (::before) se estira a 100vw desde el centro,
   como Pago e Inscripcion (el body tiene overflow-x:hidden) */
.cvo_temario{
	position:relative;
	isolation:isolate;
	margin:2em 0 3em 0;
	padding:56px 0 60px 0;
	font-size:16px;
	color:#e9f2fa;
	}

.cvo_temario::before{
	content:"";
	position:absolute;
	top:0;
	bottom:0;
	left:50%;
	width:100vw;
	margin-left:-50vw;
	z-index:-1;
	background:
		radial-gradient(1200px 500px at 80% 0%, #1b78bd 0%, rgba(27,120,189,0) 60%),
		linear-gradient(160deg, #0a4f82 0%, #0e67a8 55%, #155f98 100%);
	}

.cvo_temario_cab{
	display:flex;
	flex-wrap:wrap;
	justify-content:space-between;
	align-items:flex-end;
	gap:16px 24px;
	margin:0 8px 24px 8px;
	}

.cvo_temario_eyebrow{
	display:block;
	font-size:12.5px;
	font-weight:700;
	letter-spacing:0.12em;
	text-transform:uppercase;
	color:#f6c119;
	}

.cvo_temario h3.cvo_temario_titulo{
	margin:4px 0 0 0;
	padding:0;
	border:0;
	background:none;
	font-size:1.9em;
	line-height:1.15;
	font-weight:700;
	text-align:left;
	color:#ffffff;
	}

.cvo_temario h3.cvo_temario_titulo mark{
	padding:0 8px;
	border-radius:6px;
	background-color:rgba(246,193,25,0.2);
	color:#f6c119;
	}

.cvo_temario_cifras{
	display:flex;
	flex-wrap:wrap;
	gap:8px;
	}

.cvo_temario_cifras span{
	display:flex;
	flex-direction:column;
	align-items:center;
	min-width:84px;
	padding:8px 12px;
	border-radius:12px;
	background-color:rgba(255,255,255,0.1);
	font-size:12px;
	font-weight:700;
	letter-spacing:0.06em;
	text-transform:uppercase;
	color:#cfe2f3;
	}

.cvo_temario_cifras b{
	font-size:22px;
	letter-spacing:0;
	color:#ffffff;
	}

.cvo_temario_cols{
	display:grid;
	grid-template-columns:repeat(auto-fit, minmax(340px, 1fr));
	gap:18px;
	align-items:start;
	margin:0 8px;
	}

.cvo_temario_col{
	min-width:0;
	overflow:hidden;
	border-radius:16px;
	background-color:#ffffff;
	color:#4a4a4a;
	box-shadow:0 20px 44px rgba(0,20,50,0.3);
	}

.cvo_temario_col_cab{
	display:flex;
	justify-content:space-between;
	align-items:baseline;
	gap:10px;
	padding:14px 18px;
	background-color:#f4f6f9;
	}

.cvo_temario_col_cab b{
	font-size:17px;
	line-height:1.3;
	color:#2b3238;
	}

.cvo_temario_col_cab small{
	white-space:nowrap;
	font-size:13px;
	color:#6b7279;
	}

.cvo_temario_unidad{
	border-top:1px solid #e3e6ea;
	}

.cvo_temario_unidad > summary{
	list-style:none;
	display:grid;
	grid-template-columns:28px 1fr auto;
	gap:10px;
	align-items:center;
	padding:11px 18px;
	cursor:pointer;
	}

.cvo_temario_unidad > summary::-webkit-details-marker{
	display:none;
	}

.cvo_temario_unidad > summary:hover,
.cvo_temario_unidad[open] > summary{
	background-color:#e8f1f9;
	}

.cvo_temario_unidad > summary:focus-visible{
	outline:2px solid #f6c119;
	outline-offset:-2px;
	}

.cvo_temario_unidad > summary b{
	color:#0e67a8;
	}

.cvo_temario_unidad > summary span{
	font-size:15px;
	font-weight:600;
	line-height:1.35;
	color:#2b3238;
	}

.cvo_temario_unidad > summary small{
	white-space:nowrap;
	font-size:12.5px;
	color:#6b7279;
	}

.cvo_temario_det{
	padding:8px 18px 14px 56px;
	}

.cvo_temario .cvo_temario_det p{
	margin:0 0 8px 0;
	font-size:14.5px;
	line-height:1.5;
	color:#4a4a4a;
	}

.cvo_temario .cvo_temario_det ul{
	margin:0;
	padding:0 0 0 18px;
	}

.cvo_temario .cvo_temario_det li{
	margin:0 0 4px 0;
	padding:0;
	font-size:14.5px;
	line-height:1.45;
	color:#4a4a4a;
	background:none;
	}

.cvo_temario_pie{
	display:flex;
	flex-wrap:wrap;
	justify-content:space-between;
	align-items:center;
	gap:10px 18px;
	margin:20px 8px 0 8px;
	padding:14px 18px;
	border-radius:12px;
	background-color:rgba(246,193,25,0.16);
	font-weight:600;
	color:#ffffff;
	}

.cvo_temario_pie small{
	font-weight:400;
	color:#d6e6f4;
	}

@media all and (max-width: 860px){
	.cvo_temario{
		padding:44px 0 48px 0;
		}

	.cvo_temario h3.cvo_temario_titulo{
		font-size:1.55em;
		}

	.cvo_temario_cols{
		grid-template-columns:1fr;
		}
	}

@media all and (max-width: 480px){
	.cvo_temario_cifras{
		width:100%;
		}

	.cvo_temario_cifras span{
		flex:1 1 40%;
		min-width:70px;
		padding:6px 10px;
		}

	.cvo_temario_det{
		padding-left:18px;
		}
	}
/* FIN TEMARIO DESDE LA BASE   -> IA-CHG-CLAUDE | ID: 31OCT2026-04:40:00 | TEMARIO DESDE LA BASE */

/* HIPERBONUS EN PACK DE REGALO   -> IA-CHG-CLAUDE | ID: 31OCT2026-04:50:00 | HIPERBONUS PACK
   carrera_v2.class.php (defPagCarreraCursosFree, plan_carrera y navidad) arma div#div_bonus.cvo_bonus: a la izquierda
   la caja azul (sello "6 cursos", titulo, bajada y dias que quedan del mes) y a la derecha los cursos en <details>
   con tilde "Incluido". Sin JavaScript */
.cvo_bonus{
	display:grid;
	grid-template-columns:270px 1fr;
	gap:24px;
	align-items:start;
	font-size:16px;
	}

.cvo_bonus_caja{
	padding:26px 22px;
	border-radius:18px;
	text-align:center;
	color:#ffffff;
	background:linear-gradient(160deg, #0a4f82, #0e67a8);
	box-shadow:0 18px 40px rgba(14,103,168,0.28);
	}

.cvo_bonus_sello{
	display:grid;
	place-items:center;
	width:112px;
	height:112px;
	margin:0 auto 14px auto;
	border-radius:50%;
	text-align:center;
	line-height:1.05;
	font-weight:700;
	color:#3a2c00;
	background:radial-gradient(circle at 30% 25%, #ffe27a 0%, #f6c119 55%, #d9a40c 100%);
	box-shadow:0 0 0 6px rgba(255,255,255,0.9), 0 0 0 7px #f3d77a, 0 14px 30px rgba(0,20,50,0.3);
	}

.cvo_bonus_sello small{
	display:block;
	font-size:11px;
	letter-spacing:0.08em;
	text-transform:uppercase;
	}

.cvo_bonus_sello b{
	display:block;
	font-size:30px;
	}

.cvo_bonus h3.cvo_bonus_titulo{
	display:block;
	margin:0 0 8px 0;
	padding:0;
	border:0;
	background:none;
	font-size:1.35em;
	line-height:1.2;
	font-weight:700;
	text-align:center;
	color:#ffffff;
	}

.cvo_bonus p.cvo_bonus_bajada{
	margin:0;
	font-size:14.5px;
	line-height:1.5;
	text-align:center;
	color:#d6e6f4;
	}

.cvo_bonus p.cvo_bonus_bajada strong{
	color:#ffffff;
	}

.cvo_bonus_dias{
	display:inline-block;
	margin-top:14px;
	padding:4px 12px;
	border-radius:2em;
	background-color:rgba(246,193,25,0.2);
	font-size:14px;
	font-weight:700;
	color:#f6c119;
	}

.cvo_bonus_lista{
	min-width:0;
	}

.cvo_bonus_curso{
	margin:0 0 8px 0;
	border:1px solid #e3e6ea;
	border-radius:12px;
	background-color:#ffffff;
	}

.cvo_bonus_curso[open]{
	box-shadow:0 10px 24px rgba(20,40,70,0.07);
	}

.cvo_bonus_curso > summary{
	list-style:none;
	display:grid;
	grid-template-columns:auto 1fr auto;
	gap:12px;
	align-items:center;
	padding:12px 16px;
	cursor:pointer;
	}

.cvo_bonus_curso > summary::-webkit-details-marker{
	display:none;
	}

.cvo_bonus_curso > summary:focus-visible{
	outline:2px solid #f6c119;
	outline-offset:-2px;
	}

.cvo_bonus_ico{
	display:grid;
	place-items:center;
	width:38px;
	height:38px;
	border-radius:10px;
	background-color:#e8f1f9;
	color:#0e67a8;
	}

.cvo_bonus_ico svg,
.cvo_bonus_ok svg{
	fill:none;
	stroke:currentColor;
	stroke-width:1.8;
	stroke-linecap:round;
	stroke-linejoin:round;
	}

.cvo_bonus_ico svg{
	width:22px;
	height:22px;
	}

.cvo_bonus_nombre b{
	display:block;
	font-size:16px;
	color:#2b3238;
	}

.cvo_bonus_nombre small{
	font-size:14px;
	color:#6b7279;
	}

.cvo_bonus_ok{
	display:flex;
	align-items:center;
	gap:6px;
	font-size:13px;
	font-weight:700;
	color:#1f8a4c;
	}

.cvo_bonus_ok svg{
	width:18px;
	height:18px;
	stroke-width:2.2;
	}

.cvo_bonus_det{
	padding:0 16px 14px 66px;
	}

.cvo_bonus .cvo_bonus_det p{
	margin:0 0 8px 0;
	font-size:14.5px;
	line-height:1.55;
	color:#4a4a4a;
	}

/* La frase usa el estilo general de blockquote (comilla grande gris a la izquierda): aire para la comilla */
.cvo_bonus_det blockquote{
	margin:0;
	padding:10px 14px 10px 44px;
	border-left:3px solid #f6c119;
	background-color:#fffdf3;
	font-size:14px;
	font-style:italic;
	color:#2b3238;
	}

@media all and (max-width: 900px){
	.cvo_bonus{
		grid-template-columns:1fr;
		}
	}

@media all and (max-width: 560px){
	.cvo_bonus_det{
		padding-left:16px;
		}
	}
/* FIN HIPERBONUS EN PACK DE REGALO   -> IA-CHG-CLAUDE | ID: 31OCT2026-04:50:00 | HIPERBONUS PACK */

.div-test{
	border:1px solid #dba734;
	margin:10px;
	padding:15px;
	background-color:#faf8f5;
	border-radius: 0.5em;
	display:inline-block;
	box-shadow: 0 0.2em 0.4em #999999;
	font-size: 16px;
	color: #575757;
	line-height: 28px;
	word-spacing:3px;
	letter-spacing:0.2px;
	margin-left:8px;
	margin-right:8px;

}

.div-test::before
{
	background-color:#fefb00 !important;
	color: #404040!important;
	content: "\1F441\FE0F\200D\1F5E8\FE0F\00a0 MODO TEST:";
}

/* Clase universal para asignar class manito y blank en evento hover*/
.hover_manito_blank:hover{
 	cursor:pointer; cursor: hand;
	background-color: #fff;
}

.mod_menu
{
	margin:3px !important;
	padding:5px !important;
	font-size: 12px !important;
	font-weight: normal !important;
	text-align:center !important;
	border-radius:3px !important;

	background-color:#197ec8 !important;

	border-top: 1px solid #98c0dd;
	border-bottom: 2px solid #000000;

   text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.5); /* Negro suave */
	letter-spacing: 0.8px; /* Espaciado entre letras */

}

/* CARRUSEL */
.slider ul{
    padding: 0;
    list-style: none;
    display: flex;
    width: max-content;

	/*Velocidad -> Mas alto el numero mas lento va*/
    animation: runSlider 16s linear infinite;
}

.slider img{
    /*height: 68px;*/
    margin-right: 10px;
}

.slider li{
    /*background-color: #292A2E;*/
    background-color: #ffffff;
    width: 215px;
    display: flex;
    justify-content: start;
    align-items: center;
    padding: 10px;
    margin-right: 5px;

    border: 2px solid #ffc23b;
    padding: 2px;
    margin: 2px;
    border-radius: 0.5em;
    -moz-border-radius: 0.5em;
    -webkit-border-radius: 0.5em;
    -khtml-border-radius: 0.5em;
}

.logo_empresa{
    background-color: #ffffff;
    padding: 10px;
    border: 2px solid #ffc23b;
    margin: 10px;
    border-radius: 0.5em;
    -moz-border-radius: 0.5em;
    -webkit-border-radius: 0.5em;
    -khtml-border-radius: 0.5em;
    display: inline-block;
    box-shadow: 0 0.2em 0.4em #999999;
    -moz-box-shadow: 0 0.2em 0.4em #999999;
    -webkit-box-shadow: 0 0.2em 0.4em #999999;
}

.slider{
    overflow: hidden;
}

/* DIV IA PROMPT
---------------------------------*/
.div_ia_prompt {
  font-family: Consolas, Monaco, 'Lucida Console', 'Courier New', monospace;
  font-size: 15px;
  background: #f0f0f0;
  padding: 10px;
  border-left: 5px solid #ccc;
  white-space: pre-wrap;
  overflow-x: auto;
  font-feature-settings: normal;
  /* Transición suave para hover */
  transition: transform 0.2s ease, box-shadow 0.2s ease;

  /* Opcional: mejora rendimiento en animaciones */
  /*will-change: transform;*/

  /* Asegura que el contenedor no se rompa en el layout */
  display: block;
  position: relative;
  cursor:pointer; cursor: hand;
}

.div_ia_prompt:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.6);
}

/* ACCORDION
---------------------------------*/
.div_accordion{

	background: rgb(176,174,174);
    background: linear-gradient(0deg, rgba(176,174,174,1) 0%, rgba(221,221,221,1) 11%, rgba(255,255,255,1) 100%);

    padding:0px;
    font-weight: 400;
    border: 1px solid darkgrey;
    border-radius: 3px;

    cursor:pointer; cursor: hand;
}

.div_accordion:hover{
    background-image: none;
    background-color:#f0f0f0;
	transform:scale(1.005);

	-webkit-transition:.2s;
	-moz-transition:.2s;
	-transition:.2;
	border-bottom: 2px solid #4592c7;
}

.div_accordion_element{
    display:none;
	padding:10px;
	margin-left:10px;
	margin-right:10px;
	margin-bottom:10px;

	background-color:#fefef8;

	border: 1px solid #4592c7;
	border-top: 6px solid #c0bfbf;
	border-radius: 3px;

	box-shadow: 0 2px 4px #666666;
	-moz-box-shadow: 0 2px 4px #666666;
	-webkit-box-shadow: 0 2px 4px #666666;"
}

/* TABLA RESPONSIVA
---------------------------------*/
.div_contenedor_tabla_grande{
	max-width:55em;
	}

.div_contenedor_tabla_chica{
	max-width:36em;
	}

.div_contenedor_tabla_grande,
.div_contenedor_tabla_chica{

	margin:auto !important;
	overflow:hidden;
	overflow-x:auto;
	padding:0;

	background-color:#ffffff;

	border: 0.0625em solid #d9e2ea;

	box-shadow: 0 0.125em 0.375em rgba(0,0,0,0.08);
	-moz-box-shadow: 0 0.125em 0.375em rgba(0,0,0,0.08);
	-webkit-box-shadow: 0 0.125em 0.375em rgba(0,0,0,0.08);

	border-radius: 0.5em;
	-moz-border-radius: 0.5em;
	-webkit-border-radius:0.5em;
	-khtml-border-radius: 0.5em;
	}

.div_contenedor_tabla table{
	background-color:#ffffff;
	 width: 100%;
	}

.div_contenedor_tabla table th{
	color: #ffffff;
	font-weight:bold;
	background-color:#2975ac;
	padding:0.5em;
	font-size: 16px;
	font-style: normal;
	border-bottom: 0.1875em solid #f6c119;

}

.div_contenedor_tabla table td{
	color:#4a4a4a;
	border-bottom: 0.0625em solid #e3e6e8;
	font-style: normal;
	text-align:left;
	padding:0.75em 1em;
	}

.div_contenedor_tabla tr:nth-of-type(odd){
  	background-color:#f0f5f8;
	}

.div_figure img{
	display:block;
	margin:auto !important;
	}

.div_figure, figcaption {
    font-style:italic;
	font-size:0.875em;
	color: #0e67a8;
	line-height:1.5em;
    margin:0.75em 0;
    text-align:center;
	}

.p_titulo_verde{
	color: #ffffff;
	font-size:1.375em; /* 22px */
	background-color:#699c0c;

	box-shadow: 0 0.2em 0.4em #999999;
	-moz-box-shadow: 0 0.2em 0.4em #999999;
	-webkit-box-shadow: 0 0.1em 0.2em #999999;

	text-shadow:0.0625em 0.0625em 0 #45640e, 0.125em 0.125em 0.125em #45640e;

	margin-left:-0.5em;
	margin-top:3em;

	padding-left:0.5em;
	padding-top:1.2em;

	border-bottom:0.0625em solid #ffffff;
	border-top:0.0625em solid #557914;

}

.texto_multimedia_lecciones{
	font-size:0.75em;

	}

.contenedor_de_video_jwplayer{

  	max-width:30em;
    border: 0.125em solid #0e67a8;
	background-color:#0e67a8;

    box-shadow: 0 0.2em 0.4em #999999;
    -moz-box-shadow: 0 0.2em 0.4em #999999;
    -webkit-box-shadow: 0 0.1em 0.2em #999999;

	padding:0;
	margin:auto;

    border-radius: 0.3125em;
	-moz-border-radius: 0.3125em;
	-webkit-border-radius:0.3125em;
	-khtml-border-radius: 0.3125em;
	}

.contenedor_de_audio_jwplayer{

	max-width:19.375em;
    border: 0.125em solid #0e67a8;

    box-shadow: 0 0.2em 0.4em #999999;
    -moz-box-shadow: 0 0.2em 0.4em #999999;
    -webkit-box-shadow: 0 0.1em 0.2em #999999;

    border-radius: 0.3125em;
	-moz-border-radius: 0.3125em;
	-webkit-border-radius:0.3125em;
	-khtml-border-radius: 0.3125em;

	background-image:url(/inc/jwplayer/imgs/img-fondo-audiofile_loading.gif);
	background-color:#0e67a8;
	background-position: center center;

	text-align:right;
	}

.head_solapa h2
{
	color: #006dba !important;
	font-size:1.65em !important;
	padding-top:0;
	padding-bottom:0;
	padding-left:0.2em;
	padding-right:0.2em;
	text-shadow: 0.125em 0.125em 0.125em #d5d6d7 !important;
	background-color: transparent !important;

	border-left:0;
	margin-left:0;
	margin-right:0;

	box-shadow: none !important;
	-moz-box-shadow: none !important;
	-webkit-box-shadow: none !important;

	border-bottom:0 !important;
	}

.div_scroll{
	height:50em;
	min-height: 220px;
	overflow-x: hidden;
	overflow-y: scroll;
  	resize: vertical;

	margin-left:1em;
	margin-right:1em;
	margin-top:-0.5em;

	padding:0.5em;
	text-align:left;

	border: 0.0625em solid #e8eaec;
	border-radius: 0.1875em;
	background-color:#fffdf7;

	-moz-border-radius: 0.2em;
	-webkit-border-radius: 0.2em;
	-khtml-border-radius: 0.2em;

	box-shadow: 0 0.25em 0.25em #CCC;
	-moz-box-shadow: 0 0.25em 0.25em #CCC;
	-webkit-box-shadow: 0 0.25em 0.25em #CCC;
	}

/* Paginador de contenidos
----------------------------------------*/
.div_paginador{
	text-align:center;

	width: 100%;

	color:#0e67a8 !important;

	text-align:center;
	/*background-color:yellow;*/

	padding-top:0.5em;

	}

.paginador_cont_dinamico{
	width:100%;
	/*background-color:grey;*/

	text-align:center;

	margin:auto;
	padding-top:0.5em;
	padding-bottom:0.5em;
	margin-top:0.5em;
	}

.paginador_cont_estatico{
	margin-top:0.75em;
	padding-top:0.625em;
	border-top: 0.25em #ffffff double;
	}

.paginador_cont_estatico p{
	color: #0e67a8;
	margin:0.5em;}

.paginador_cont_paginas,
.paginador_cont_paginas_foco
{
	width: 2.5em;
	height:2.5em;

	text-align:center;
	margin:auto;

	display: inline-block;
	margin:0.5em;

	cursor:pointer; cursor: hand;
	background-color: #f7f7f7;

	border: 0.0625em solid #FFF;
	box-shadow: 0 0.125em 0.25em #CCC;
	-moz-box-shadow: 0 0.125em 0.25em #CCC;
	-webkit-box-shadow: 0 0.125em 0.25em #CCC;

	border-radius: 0.3125em;
	-moz-border-radius: 0.3125em;
	-webkit-border-radius:0.3125em;
	-khtml-border-radius: 0.3125em;
	}

.paginador_cont_paginas p,
.paginador_cont_paginas_foco p{
 	margin-top:20%;
	color: #0e67a8;
	}

.paginador_cont_paginas:hover, .paginador_cont_paginas_foco{
	background-color:#0e67a8;

	color: #FFF !important;

	box-shadow: none !important;
	-moz-box-shadow: none !important;
	-webkit-box-shadow: none !important;
	}

.paginador_cont_paginas_foco p {
	color: #f7c84a !important;
	}

.paginador_cont_paginas:hover p{
	color: #FFF !important;
	}

.paginador_cont_paginas_movs{
	background-color:#bccdd9;
}

.termino_descipcion ul li{
	margin-top:1em;
	margin-bottom:1em;
	list-style-image:url(/cvo_files/img_sistema_elearning/iconografia_sap_abap/lastpost.gif);
	}

/*-----------------------------------------------*/
/* FONDOS / FUENTES / BORDES / TAMAÑOS Y COLORES
/*--------------------------------------------*/
/* Fondos
----------------------*/
.fondo_azul_cvo{
	background-color: #0e67a8;
	}

.fondo_naranja_cvo{
	background-color: #f6c119;
	color: #0e67a8;
	padding:0.2em;
	}

.fondo_verde{
	background-color: #59A222;
	}

.fondo_celeste{
	background-color: #80A8C3;
	}

.fondo_rojo{
	background-color: #CC3333;
	}

.fondo_gris{
	background-color: #a19e9e;
	}

.fondo_violeta{
	background-color: #80309E;
	}

.fondo_azul_cvo,
.fondo_verde,
.fondo_celeste,
.fondo_rojo,
.fondo_gris,
.fondo_violeta {
	color: #f7f5f5;
	padding:0.2em;
	}

.fondo_blanco{
	background-color: #f7f5f5;
	padding:0.2em;
	}

/* Bordes
----------------------*/
.borde_doble_azul_cvo{
	border: 0.1875em double #0e67a8;
	}

.borde_azul_cvo{
	border: 0.0625em solid #0e67a8;
	}

.borde_punteado_azul{
	border: 0.0625em dashed #0e67a8;
	}

.borde_naranja_cvo{
	border: 0.0625em solid #f6c119;
	}

.borde_punteado_naranja{
	border: 0.0625em dashed #f6c119;
	}

.borde_gris{
	border: 0.0625em solid #a19e9e;
	}

.borde_gris_sombra{
	border: 0.0625em solid #a19e9e;
	box-shadow: 0.0625em 0.0625em 0.0625em #ffffff, 0.125em 0.125em 0.125em #a19e9e;
	}

.borde_redondeado_gris{
	border: 0.0625em solid #a19e9e;

	border-radius: 0.375em;
	-moz-border-radius: 0.375em;
	-webkit-border-radius: 0.375em;
	-khtml-border-radius: 0.375em;
	}

/* Imagen en listados de alumnos
------------------------------------*/
.img_alumno_en_listado_sin_hover	{
	border: 5px #f5e5a6 solid;
	box-shadow: 2px 2px 2px #4592c7;
	-webkit-box-shadow: 2px 2px 2px #4592c7;
	-moz-box-shadow: 2px 2px 2px #4592c7;

	border-radius: 10px;
	-moz-border-radius: 7px;
	-webkit-border-radius: 7px;
	}

.img_alumno_en_listado	{
	border: 5px #f5e5a6 solid;
	box-shadow: 2px 2px 2px #4592c7;
	-webkit-box-shadow: 2px 2px 2px #4592c7;
	-moz-box-shadow: 2px 2px 2px #4592c7;

	border-radius: 10px;
	-moz-border-radius: 7px;
	-webkit-border-radius: 7px;
	}

.img_alumno_en_listado:hover {
	-webkit-transform:scale(1.3);
	-moz-transform:scale(1.3);
	transform:scale(1.3);
	margin:1em;
	-webkit-transition:.1s;
	-moz-transition:.1s;
	-transition:.1s;
	}

.medium{
	font-size: 0.75em;
	}

.small{
	font-size: 0.5625em;
	}

.tres_cols-col_centro {
	display: table-cell;
	text-align:center;
	background-color:#0C0;
	max-width:100%;
	width:100%;
	}

.tres_cols-col_der,
.tres_cols-col_izq{
	display: table-cell;
	}

.tres_cols-col_centro a{
	display: inline-block !important;
    max-width:100% !important;
    width:100% !important;

    border-radius:0 !important;
    -moz-border-radius:0 !important;
    -webkit-border-radius:0 !important;
    -khtml-border-radius:0 !important;
	padding-right:0 !important;
	}

.tres_cols-col_der a,
.tres_cols-col_izq a{
	display:inline-block !important;
	padding-left:1em !important;
	padding-right:1em !important;

	margin-right:-0.125em !important;

	border-radius: 0 !important;
	-moz-border-radius: 0 !important;
	-webkit-border-radius: 0 !important;
	-khtml-border-radius: 0 !important;
	}

/* Imagenes responsivas deben llevar esta clase
-------------------------------------------------*/
.img_bi{
	background-image:url(/cvo_files/imgs_sap_abap/cvosoft_backimg.gif);
	background-position: center center;
	background-repeat: no-repeat;
	}

.img_rsp{}

.img_borde_redondeado{
	border-radius: 0.3125em;
	-moz-border-radius: 0.3125em;
	-webkit-border-radius:0.3125em;
	-khtml-border-radius: 0.3125em;
	}

.img_shadow{
	border: 0.125em solid #e8eaec;
	box-shadow: 0 0.2em 0.4em #999999;
	-moz-box-shadow: 0 0.2em 0.4em #999999;
	-webkit-box-shadow: 0 0.2em 0.4em #999999;
	}

/* Todas las cosas que se le asigna esta clase,
   deaspareceran cuando se alcanza la resolucion para mobiles */
.hide_for_mobile{}

.show_for_mobile{
	display:none;
	}

.div_posicion_centrada{
	display: table;
	margin-left:auto;
	margin-right:auto;
	}

/* Modelo Una fila dos columas con imagen a la izquierda */
.div_fila_2cols_img_izq-col_izquierda{
	/* En  esta estructura, esta es la columna que contiene la imagen */
	display: table-cell;
	vertical-align: top;
	text-align:center;
	padding-right:0.3125em;
	padding-left:0.3125em;
	}

.div_fila_2cols_img_izq-col_derecha{
	display: table-cell;
	padding-left:0.3125em;
	}

.div_fila_2cols_img_der-col_izquierda{
	display: table-cell;
	padding-left:0.3125em;
	}

.div_fila_2cols_img_der-col_derecha{
  	/* En  esta estructura, esta es la columna que contiene la imagen */
	display: table-cell;
	vertical-align: top;
	text-align:center;
	padding-right:0.3125em;
	padding-left:0.3125em;
	}

/* Tarjeta de imagen principal de curso/carrera (getMensajePagPlanCarreraSeccionHead): imagen + zocalo con el nombre,
   clic abre el cuadro Compartir. Reemplaza los estilos inline que tenia ese bloque  */
.tarjeta_curso{
	display:flex;
	justify-content:center;
	width:100%;
	}

.tarjeta_curso .tarjeta_curso_cuadro,
.tarjeta_curso .tarjeta_curso_cuadro:hover{
	/* selector compuesto (y :hover) para pisar padding-bottom/border de .img_transition, border de .img_shadow
	   y el fondo celeste de .img_transition:hover, como lo hacian los estilos inline */
	width:100%;
	max-width:385px;
	text-align:center;
	padding:2px;
	margin-bottom:2px;
	border:0;
	background-color:#17466e; /* marco: azul profundo, como el borde de las imagenes de carrera */
	cursor:pointer;
	}

/* Tarjeta con video (pagina de carrera con video local): el <video> reemplaza a la imagen; sin zoom al hover (los controles
   son del player); el ancho 480px lo fija el PHP en el style de la tarjeta y max-width:100% lo acota en movil; el zocalo conserva Compartir */
.tarjeta_curso .tarjeta_curso_cuadro_video,
.tarjeta_curso .tarjeta_curso_cuadro_video:hover{
	max-width:100%;
	cursor:default;
	}

/* Boton "Activar sonido": oculto por defecto; el script de getVideoLocal() (modo tarjeta_head) le agrega
   .tarjeta_video_sonido_on solo si el navegador bloqueo el autoplay con audio. Arriba a la izquierda para no tapar
   los controles del player */
.tarjeta_video_sonido{
	display:none;
	position:absolute;
	top:10px;
	left:10px;
	z-index:2;
	margin:0;
	padding:7px 14px 7px 12px;
	font-family:inherit;
	font-size:14px;
	font-weight:bold;
	line-height:1.2;
	color:#ffffff;
	background-color:rgba(0,0,0,0.72);
	border:2px solid #f6c119;
	border-radius:20px;
	box-shadow:0 2px 8px rgba(0,0,0,0.45);
	cursor:pointer;
	}

.tarjeta_video_sonido.tarjeta_video_sonido_on{
	display:inline-block;
	animation:tarjeta_video_sonido_pulso 2.2s ease-in-out 3;
	}

.tarjeta_video_sonido:hover,
.tarjeta_video_sonido:focus{
	background-color:#0c6db3;
	outline:none;
	}

video.tarjeta_curso_video{
	display:block;
	width:100%;
	height:auto;
	background-color:#000000;
	border-top-left-radius:3px;
	border-top-right-radius:3px;
	}

.tarjeta_curso_cuadro_video .tarjeta_curso_zocalo{
	cursor:pointer;
	}

.tarjeta_curso_img{
	display:block;
	max-width:100%;
	margin:0 auto;
	border-top-left-radius:3px;
	border-top-right-radius:3px;
	}

/* Zocalo: degrade azul CVO -> azul profundo con filete dorado arriba (continua las ondas amarillas de la imagen).
   Nombre centrado + pildora "Compartir" (icono QR) a la derecha, que se enciende al pasar el mouse por la tarjeta */
.tarjeta_curso_zocalo{
	display:flex;
	align-items:center;
	color:#ffffff;
	font-size:16px;
	font-weight:bold;
	line-height:25px;
	padding:6px 8px 7px 8px;
	text-align:center;
	text-shadow:0 1px 1px rgba(0,0,0,0.35);
	border-top:2px solid #f6c119;
	background-color:#1f5f8f;
	background-image:linear-gradient(180deg, #2975ac 0%, #1b4f7c 100%);
	}

.tarjeta_curso_nombre{
	flex:1 1 auto;
	text-transform:uppercase;
	letter-spacing:0.03em;
	}

.tarjeta_curso_compartir{
	flex:0 0 auto;
	display:inline-block;
	margin-left:6px;
	padding:2px 8px 2px 6px;
	font-size:11px;
	font-weight:normal;
	line-height:16px;
	letter-spacing:0.04em;
	text-transform:uppercase;
	white-space:nowrap;
	color:#f6c119;
	border:1px solid rgba(246,193,25,0.55);
	border-radius:1em;
	-webkit-transition:.2s;
	-moz-transition:.2s;
	transition:.2s;
	}

.tarjeta_curso_compartir svg{
	width:13px;
	height:13px;
	margin-right:4px;
	vertical-align:-2px;
	}

.tarjeta_curso .tarjeta_curso_cuadro:hover .tarjeta_curso_compartir{
	color:#17466e;
	background-color:#f6c119;
	border-color:#f6c119;
	text-shadow:none;
	}

/* HUB DE AREA (getCarreraCuerpoHtml): tarjetas de cursos y carreras al estilo buscador. Cabecera ilustrada con la
   categoria y el nombre; cuerpo con nombre (h3), datos, objetivos recortados a 3 lineas (el texto completo queda en el
   HTML para buscadores e IAs), precio y boton */
.cvohub_grid{
	display:grid;
	grid-template-columns:repeat(auto-fill, minmax(19em, 1fr));
	gap:1.5em;
	margin:0 0 3em 0;
	}

.cvohub_tarjeta{
	display:flex;
	flex-direction:column;
	overflow:hidden;
	background-color:#ffffff;
	border:0.0625em solid #e3e6e8;
	border-radius:0.75em;
	box-shadow:0 0.25em 1em rgba(14,103,168,0.08);
	-webkit-transition:.2s;
	-moz-transition:.2s;
	transition:.2s;
	}

.cvohub_tarjeta:hover{
	box-shadow:0 0.5em 1.5em rgba(14,103,168,0.16);
	-webkit-transform:translateY(-2px);
	transform:translateY(-2px);
	}

/* TARJETA COMO LINK COMPLETO: .cvohub_tarjeta_linkfull es un <a> absoluto que cubre la tarjeta (z-index 1).
   Los controles reales (boton de nivel con su capa, h3 y boton del pie) quedan por encima (z-index 2) y siguen
   funcionando; el resto de la tarjeta clickea el link, tambien en movil */
.cvohub_tarjeta_link{
	position:relative;
	}

.cvohub_tarjeta_linkfull{
	position:absolute;
	top:0;
	left:0;
	right:0;
	bottom:0;
	z-index:1;
	border-radius:inherit;
	}

.cvohub_tarjeta_link .cvohub_tarjeta_nombre a,
.cvohub_tarjeta_link a.cvohub_tarjeta_btn,
.cvohub_tarjeta_link button.cvonivel_boton,
.cvohub_tarjeta_link .cvohub_tarjeta_datos [id^="div_mensaje_nivel_"]{
	position:relative;
	z-index:2;
	}

/* Pildora "Ver mas ->" sobre la ilustracion: invita a abrir; aparece al hover (y con foco de teclado) y
   acompania al translateY que la tarjeta ya tiene. \E1 = a con tilde, \2192 = flecha (archivo en ASCII) */
.cvohub_tarjeta_linkfull::after{
	content:"Ver m\E1 s \2192";
	position:absolute;
	left:50%;
	top:4.2em;
	transform:translate(-50%,0) translateY(10px);
	padding:0.55em 1.4em;
	font-size:15px;
	font-weight:700;
	white-space:nowrap;
	color:#ffffff;
	background-color:#0c6db3;
	border:0.125em solid #f6c119;
	border-radius:2em;
	box-shadow:0 0.3em 1em rgba(0,0,0,0.3);
	opacity:0;
	-webkit-transition:.2s;
	-moz-transition:.2s;
	transition:.2s;
	}

.cvohub_tarjeta_link:hover .cvohub_tarjeta_linkfull::after,
.cvohub_tarjeta_link:focus-within .cvohub_tarjeta_linkfull::after{
	opacity:1;
	transform:translate(-50%,0);
	}

/* Cabecera: la ilustracion va de fondo, anclada a la derecha; el nombre grande ocupa la mitad izquierda */
.cvohub_tarjeta_cabecera{
	position:relative;
	min-height:10.5em;
	padding:0.9em 1em 1em 1em;
	background-repeat:no-repeat;
	background-position:right center;
	background-size:cover;
	}

.cvohub_cab_curso{
	background-color:#e8f2fb;
	background-image:url(/cvo_files/img_sistema_elearning/iconografia_sap_abap/svg/hub_curso.svg);
	}

.cvohub_cab_carrera{
	background-color:#fcf1d2;
	background-image:url(/cvo_files/img_sistema_elearning/iconografia_sap_abap/svg/hub_carrera.svg);
	}

/* Hub maestro (/cursos): ilustracion por area de formacion. Doble clase: gana a .cvohub_cab_carrera
   (que la tarjeta conserva como respaldo) sin depender del orden en la hoja */
.cvohub_tarjeta_cabecera.cvohub_cab_area_usuario{
	background-image:url(/cvo_files/img_sistema_elearning/iconografia_sap_abap/svg/hub_area_usuario.svg);
	}

.cvohub_tarjeta_cabecera.cvohub_cab_area_tecnica{
	background-image:url(/cvo_files/img_sistema_elearning/iconografia_sap_abap/svg/hub_area_tecnica.svg);
	}

.cvohub_tarjeta_cabecera.cvohub_cab_area_financiera{
	background-image:url(/cvo_files/img_sistema_elearning/iconografia_sap_abap/svg/hub_area_financiera.svg);
	}

.cvohub_tarjeta_cabecera.cvohub_cab_area_logistica{
	background-image:url(/cvo_files/img_sistema_elearning/iconografia_sap_abap/svg/hub_area_logistica.svg);
	}

.cvohub_tarjeta_cabecera.cvohub_cab_area_hcm{
	background-image:url(/cvo_files/img_sistema_elearning/iconografia_sap_abap/svg/hub_area_hcm.svg);
	}

.cvohub_tarjeta_categoria{
	display:inline-block;
	padding:0.2em 0.7em;
	font-size:12px;
	font-weight:600;
	color:#17466e;
	background-color:#ffffff;
	border-radius:0.4em;
	}

.cvohub_tarjeta_badge{
	position:absolute;
	top:0.9em;
	right:1em;
	padding:0.15em 0.6em;
	font-size:11px;
	font-weight:700;
	color:#17466e;
	background-color:#ffe86b;
	border-radius:1em;
	}

.cvohub_tarjeta_titulo_cab{
	display:block;
	width:58%;
	margin-top:0.6em;
	font-size:1.45em;
	font-weight:700;
	line-height:1.15em;
	color:#17466e;
	}

.cvohub_tarjeta_cuerpo{
	display:flex;
	flex-direction:column;
	flex:1 1 auto;
	padding:1em 1.1em 1.2em 1.1em;
	}

/* border-left y padding en 0: anulan la barra amarilla que la media query movil le pone a todo h3 */
h3.cvohub_tarjeta_nombre{
	margin:0 0 0.5em 0;
	padding:0;
	border-left:0;
	font-size:1.2em;
	line-height:1.3em;
	}

.cvohub_tarjeta_nombre a{
	color:#0c6db3 !important;
	text-decoration:none;
	}

.cvohub_tarjeta_nombre a:hover{
	text-decoration:underline;
	text-decoration-color:#f6c119;
	}

.cvohub_tarjeta_datos{
	margin-bottom:0.6em;
	}

.cvohub_dato{
	margin:0 0 0.3em 0;
	font-size:15px;
	line-height:1.5em;
	color:#4a4a4a;
	}

.cvohub_dato_detalle{
	color:#7a7a7a;
	font-size:13px;
	}

/* Nivel en la tarjeta (mostrar_nivel_formacion, modo tarjeta_hub): el mismo boton del listado que despliega la capa
   con los niveles; aqui sin aspecto de boton: texto + 5 letras con el subrayado punteado que indica accion. Si no
   entra, las letras bajan a la linea siguiente alineadas a la izquierda */
button.cvonivel_boton{
	display:flex;
	flex-wrap:wrap;
	align-items:center;
	gap:0.3em 0.6em;
	width:100%;
	margin:0 0 0.3em 0;
	padding:0;
	font-family:inherit;
	font-size:15px;
	line-height:1.5em;
	text-align:left;
	color:#4a4a4a;
	background:none;
	border:0;
	cursor:pointer;
	}

button.cvonivel_boton:hover .cvonivel_letras{
	border-bottom-color:#0e67a8;
	}

.cvonivel_letras{
	display:inline-flex;
	gap:3px;
	padding-bottom:3px;
	border-bottom:1px dashed #dba734;
	}

.cvonivel_letra{
	display:inline-block;
	width:18px;
	height:18px;
	line-height:18px;
	font-size:10px;
	font-weight:700;
	text-align:center;
	color:#9aa3ab;
	background-color:#f1f3f5;
	border:1px solid #dde2e6;
	border-radius:50%;
	}

.cvonivel_letra_on{
	color:#17466e;
	background-color:#ffe86b;
	border-color:#e0b800;
	}

/* Capa desplegada con los niveles dentro de la tarjeta: lista a la escala de la tarjeta */
.cvohub_tarjeta_datos [id^="div_mensaje_nivel_"] ul{
	margin:0.3em 0 0.6em 0;
	padding-left:1.2em;
	}

.cvohub_tarjeta_datos [id^="div_mensaje_nivel_"] li{
	margin:0.2em 0;
	font-size:13px;
	line-height:1.45em;
	}

/* Objetivos: tres lineas visibles; el resto sigue en el HTML */
p.cvohub_tarjeta_desc{
	display:-webkit-box;
	-webkit-line-clamp:3;
	-webkit-box-orient:vertical;
	overflow:hidden;
	margin:0 0 0.9em 0;
	font-size:14px;
	line-height:1.5em;
	color:#666666;
	}

/* Pie de la tarjeta (precio + boton): margin-top:auto lo apoya abajo, haya o no precio */
.cvohub_tarjeta_pie{
	margin-top:auto;
	}

.cvohub_tarjeta_precio{
	padding-top:0.8em;
	border-top:0.0625em solid #eef0f2;
	}

.cvohub_tarjeta_off{
	display:inline-block;
	margin-bottom:0.4em;
	padding:0.15em 0.6em;
	font-size:12px;
	font-weight:700;
	color:#1d6b36;
	background-color:#d9f2e1;
	border-radius:1em;
	}

.cvohub_tarjeta_valor{
	font-size:15px;
	line-height:1.5em;
	color:#4a4a4a;
	}

/* Boton a todo el ancho, azul de marca (el modelo usa naranja: aqui la paleta CVOSOFT) */
a.cvohub_tarjeta_btn{
	display:block;
	margin-top:1em;
	padding:0.75em 1em;
	font-size:15px;
	font-weight:700;
	text-align:center;
	color:#ffffff !important;
	text-decoration:none;
	background-color:#0e67a8;
	border-radius:2em;
	-webkit-transition:.2s;
	-moz-transition:.2s;
	transition:.2s;
	}

a.cvohub_tarjeta_btn:hover{
	color:#17466e !important;
	background-color:#f6c119;
	}

/* Solapas del hub: pildoras centradas que bajan de linea; en movil una sola fila que se desliza */
.cvohub_solapas{
	display:flex;
	flex-wrap:wrap;
	justify-content:center;
	gap:0.6em;
	padding:1.5em 0 2em 0;
	}

a.cvohub_solapa{
	display:inline-block;
	padding:0.55em 1.2em;
	font-size:15px;
	font-weight:600;
	white-space:nowrap;
	color:#17466e !important;
	text-decoration:none;
	background-color:#ffffff;
	border:0.0625em solid #d9dde2;
	border-radius:2em;
	-webkit-transition:.2s;
	-moz-transition:.2s;
	transition:.2s;
	}

a.cvohub_solapa:hover{
	color:#0e67a8 !important;
	background-color:#eaf4fc;
	border-color:#0e67a8;
	}

.indicadores_perfil_alumno{

	cursor:help;
	margin-top:0.1875em;
	margin-bottom:0.1875em;

	padding:0.5em;
	padding-top:0.3em;
	padding-bottom:0.3em;

	font-size:0.75em;
	font-weight:bold;

	color: #747373 !important;
	background-color:#e1e1e0;

	display:inline-block;

	border-radius: 0.625em;
	-moz-border-radius: 0.625em;
	-webkit-border-radius: 0.625em;
	-khtml-border-radius: 0.625em;

	box-shadow: 0 0.125em 0.25em #666666;
	-moz-box-shadow: 0 0.125em 0.25em #666666;
	-webkit-box-shadow: 0 0.125em 0.25em #666666;

	border: 0.0625em solid #7f8080;
	text-shadow:0.0625em 0.0625em 0 #ffffff, 0.125em 0.125em 0.125em #d5d6d7;
}

/* Links con efecto boton
--------------------------*/
a.link_responsivo_modelo1,
a.link_responsivo_modelo2,
a.link_responsivo_modelo3{
	display:inline-block;
	text-decoration: none;
	padding:0.625em;

	font-weight:bold;

	border-radius: 0.5em;
	-moz-border-radius: 0.5em;
	-webkit-border-radius: 0.5em;
	-khtml-border-radius: 0.5em;

	box-shadow: 0 0.125em 0.25em #999999;
	-moz-box-shadow: 0 0.125em 0.25em #999999;
	-webkit-box-shadow: 0 0.125em 0.25em #999999;

	-webkit-transition:.15s;
	-moz-transition:.15s;
	transition:.15s;
	}

a.link_responsivo_modelo1{
	color: #ffffff !important;
	background-color:#62a3d2;
	border: 0.0625em solid #0e67a8;
	border-bottom: 3px solid #0e67a8;
}

a.link_responsivo_modelo2{
	color: #747373 !important;
	background-color:#f7c84a;
	border: 0.0625em solid #ab8111;
	border-bottom: 3px solid #ab8111;
	}

a.link_responsivo_modelo3{
	color: #747373 !important;
	background-color:#e1e1e0;
	border: 0.0625em solid #7f8080;
	border-bottom: 3px solid #686969;
	}

/* Cajas doradas (boton de inscripcion, caja de certificacion: gradiente inline en la pagina de carrera): texto blanco */
a.link_responsivo_modelo3[style*="radial-gradient"],
a.link_responsivo_modelo3[style*="radial-gradient"] span,
a.link_responsivo_modelo3[style*="radial-gradient"] strong,
.logo_empresa[style*="radial-gradient"],
.logo_empresa[style*="radial-gradient"] span,
.logo_empresa[style*="radial-gradient"] strong{
	color:#ffffff !important;
	text-shadow:0.0625em 0.0625em 0 rgba(0,0,0,0.45);
	}

a.link_responsivo_modelo3[style*="radial-gradient"]{
	border-color:#8a6e2f;
	}

a.link_responsivo_modelo1:hover, a.link_responsivo_modelo1:active,
a.link_responsivo_modelo2:hover, a.link_responsivo_modelo2:active,
a.link_responsivo_modelo3:hover, a.link_responsivo_modelo3:active{
	box-shadow: none;
	-moz-box-shadow: none;
	-webkit-box-shadow: none;

	padding-top:0.6875em;
	padding-bottom:0.5625em;
	padding-left:0.6875em;
	padding-right:0.5625em;
	}

a.link_responsivo_modelo1:hover, a.link_responsivo_modelo1:active{
	color: #0e67a8 !important;
	background-color:#bfd6e6;
	}

a.link_responsivo_modelo2:hover, a.link_responsivo_modelo2:active{
	color: #9c760f !important;
	background-color:#fade93;
	}

a.link_responsivo_modelo3:hover, a.link_responsivo_modelo3:active{
	background-color:#f3f2f1;
	}

/* Links con efecto boton modelo1 - Sin sombra
-----------------------------------------------*/
a.link_responsivo_modelo1-SS,
a.link_responsivo_modelo2-SS,
a.link_responsivo_modelo3-SS{
	display:inline-block;
	text-decoration: none;
	padding:0.625em;
	font-weight:bold;
	border-radius: 0.5em;
	-moz-border-radius: 0.5em;
	-webkit-border-radius: 0.5em;
	-khtml-border-radius: 0.5em;

	}

a.link_responsivo_modelo1-SS{
	color: #ffffff !important;
	background-color:#62a3d2;
	border: 0.0625em solid #0e67a8;
	border-bottom: 3px solid #0e67a8;
	}

a.link_responsivo_modelo2-SS{
	color: #747373 !important;
	background-color:#f7c84a;
	border: 0.0625em solid #ab8111;
	border-bottom: 3px solid #ab8111;
	}

a.link_responsivo_modelo3-SS{
	color: #747373 !important;
	background-color:#e1e1e0;
	border: 0.0625em solid #7f8080;
	border-bottom: 3px solid #686969;
	}

a.link_responsivo_modelo1-SS:hover, a.link_responsivo_modelo1-SS:active{
	color: #0e67a8 !important;
	background-color:#bfd6e6;
	padding:0.625em;
	}

a.link_responsivo_modelo2-SS:hover, a.link_responsivo_modelo2-SS:active{
	color: #9c760f !important;
	background-color:#fade93;
	padding:0.625em;
	}

a.link_responsivo_modelo3-SS:hover, a.link_responsivo_modelo3-SS:active{
	background-color:#f3f2f1;
		padding:0.625em;
	}

/* Listados responsivos
-------------------------*/
.listado_rsp li{
	margin-top:0.9em;
	margin-bottom:0.9em;
	}

.tabulador_circulo_engranaje{
	text-align:center;
	margin-left:1em;
	list-style-image:url(/cvo_files/img_sistema_elearning/iconografia_sap_abap/esfera_unidad.gif);
	list-style-position:inside;
	}

.lista_sin_vineta{
	list-style:none
	}

.tabulador_circulo_birrete{
	list-style-image:url(/cvo_files/img_sistema_elearning/iconografia_sap_abap/carreas_sap.png);
	}

.tabulador_flecha_verde{
	tabulador_expandir_contraer
	}

.tabulador_flecha_roja{
	list-style-image:url(/cvo_files/img_sistema_elearning/iconografia_sap_abap/lastpost_rojo.gif);
	}

.tabulador_expandir_contraer{
	list-style-image:url(/cvo_files/img_sistema_elearning/iconografia_sap_abap/ico-subir-bajar.png);
	}

.tabulador_flecha_celeste{
	list-style-image:url(/cvo_files/img_sistema_elearning/iconografia_sap_abap/lastpost.gif);
	}

.tabulador_flecha_marron{
	list-style-image:url(/cvo_files/img_sistema_elearning/iconografia_sap_abap/lastpost_marron.gif);
	}

.tabulador_flecha_gris{
	list-style-image:url(/cvo_files/img_sistema_elearning/iconografia_sap_abap/lastpost_off.gif);
	}

.tabulador_carreras{
	list-style-image:url(/cvo_files/img_sistema_elearning/iconografia_sap_abap/carreas_sap.png);
	}

.tabulador_video{
	list-style-image:url(/cvo_files/img_sistema_elearning/iconografia_sap_abap/camara.gif);
	}

.tabulador_audio{
	list-style-image:url(/cvo_files/img_sistema_elearning/iconografia_sap_abap/sound.png);
	}

.tabulador_video{
	list-style-image:url(/cvo_files/img_sistema_elearning/iconografia_sap_abap/camara.gif);
	}

.tabulador_regalo{
	list-style-image:url(/cvo_files/imgs_sap_abap/gift_small.png);
	}

.tabulador_herramienta{
	list-style-image:url(/cvo_files/img_sistema_elearning/iconografia_sap_abap/ico_conf.gif);
	}

.tabulador_cubos{
	list-style-image:url(/cvo_files/img_sistema_elearning/iconografia_sap_abap/kdf.png);
	}

.tabulador_flecha_verde_anim{
	list-style-image:url(/cvo_files/img_sistema_elearning/iconografia_sap_abap/lastpost_verde_anim.gif);
	}

.tabulador_flecha_roja_anim{
	list-style-image:url(/img_sistema_elearning/iconografia_sap_abap/lastpost_rojo_anim.gif);
	}

.tabulador_flecha_celeste_anim{
	list-style-image:url(/cvo_files/img_sistema_elearning/iconografia_sap_abap/lastpost_anim.gif);
	}

.tabulador_flecha_marron_anim{
	list-style-image:url(/cvo_files/img_sistema_elearning/iconografia_sap_abap/lastpost_marron_anim.gif);
	}

.tabulador_flecha_gris_anim{
	list-style-image:url(/cvo_files/img_sistema_elearning/iconografia_sap_abap/lastpost_off_anim.gif);
	}

.shadow_oblique{
	max-width:50em;
	height:3.3125em;
	background-image:url(/img_sistema_elearning/box_shadow.png);
	background-size: 100% 100%;
	background-repeat:no-repeat;
	margin:auto;
	margin-top:-2em;
	}

.nav_btn_pildora{
	display:inline-block;
	margin-left:0.5em;
	padding:0.45em 1em;
	font-size:12px;
	font-weight:700;
	letter-spacing:0.06em;
	color:#4a4a4a !important;
	text-decoration:none;
	background-color:#eeeeee;
	border:0.0625em solid #e3e6e8;
	border-radius:2em;
	-webkit-transition:.2s;
	-moz-transition:.2s;
	transition:.2s;
	}

.nav_btn_pildora:hover{
	color:#0e67a8 !important;
	background-color:#eaf4fc;
	border-color:#bfe1fa;
	}

.nav_btn_pildora_campus{
	color:#ffffff !important;
	background-color:#0e67a8;
	border-color:#0e67a8;
	}

.nav_btn_pildora_campus:hover{
	color:#ffffff !important;
	background-color:#2975ac;
	border-color:#2975ac;
	}

/* MENU DE OPCIONES del NAV AMPLIADO DESK
-------------------------------------------*/
.menu_ppal_desktop_btn{
	font-size: 14px;
	font-weight:400;
	letter-spacing:0.04em;
	color: #4a4a4a;
	cursor:pointer;
	cursor: hand;
	display:inline;
	padding-top: 0.5em;
	padding-bottom: 0.5em;

	padding-right:1em;
	border-right: 0.0625em solid #e3e6e8;
	border-radius:0.25em 0.25em 0 0;

	-webkit-transition:.2s;
	-moz-transition:.2s;
	transition:.2s;
}

.menu_ppal_desktop_selected{
	color: #0e67a8;
	border-bottom: 3px solid #f7c149;
}

.menu_ppal_desktop_btn:hover{
	color:#0e67a8;
	background-color:#eaf4fc;
	}

.div_apunte_indicadores
{
	display:inline;
	border: 1px solid #f2f2f2;
	padding:5px;
	margin-right:10px;
	/*margin-top:5px; */

	background-color:#fafaf7;

	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius:5px;
	-khtml-border-radius: 5px;
	color:#999;

	font-size:14px;
}

/* PANELES DEL MENU PC (CURSOS Y CARRERAS, CERTIFICACION SAP, EMPRESAS, CVOSOFT): columnas con titulo azul y enlaces sin
   vineta, fila de destacados separada por una linea y franja oscura al pie con SOPORTE HUMANO. Los selectores con
   #div_menu_ampliado_desktop + clase le ganan a las reglas generales del menu (padding y hover de "a", color de "li a")
 */
.cvomega{
	max-width:76em;
	margin:0 auto;
	padding:0.75em 2em 0 2em;
	}

.cvomega_cols{
	display:flex;
	flex-wrap:wrap;
	justify-content:space-between;
	}

/* Cada columna toma el ancho de su contenido; el espacio sobrante se reparte entre columnas */
.cvomega_col{
	flex:0 1 auto;
	padding-right:1.5em;
	}

.cvomega_titulo{
	font-size:15px;
	font-weight:700;
	color:#0c6db3;
	margin:0 0 0.5em 0;
	}

.cvomega_item_desc{
	display:block;
	margin-top:0.15em;
	font-size:13px;
	line-height:1.35em;
	color:#7a7a7a;
	}

/* Paneles con pocas columnas (CERTIFICACION SAP, EMPRESAS, CVOSOFT): columnas y destacados alineados a la izquierda con
   separacion fija, en vez de repartirse a todo el ancho */
.cvomega_izq .cvomega_cols{
	justify-content:flex-start;
	}

.cvomega_izq .cvomega_col{
	padding-right:5em;
	}

/* Etiqueta NUEVO: pildora chica junto al nombre (como las etiquetas Bootcamp del modelo) */
.cvomega_badge{
	display:inline-block;
	margin-left:0.4em;
	padding:0 0.5em;
	font-size:11px;
	font-weight:700;
	line-height:1.6em;
	color:#17466e;
	background-color:#ffe86b;
	border-radius:1em;
	vertical-align:1px;
	}

/* Fila de destacados: cuatro accesos con titulo azul y bajada; un separador vertical divide los dos grupos */
.cvomega_destacados{
	display:flex;
	align-items:flex-start;
	border-top:0.0625em solid #d9dde2;
	padding:1.1em 0 1.3em 0;
	}

.cvomega_dest_titulo{
	display:block;
	font-size:15px;
	font-weight:700;
	color:#0c6db3;
	margin-bottom:0.25em;
	}

.cvomega_dest_texto{
	display:block;
	font-size:14px;
	color:#4a4a4a;
	}

.cvomega_dest_sep{
	flex:0 0 0.0625em;
	align-self:stretch;
	margin-right:1.5em;
	background-color:#d9dde2;
	}

/* Franja inferior oscura a todo el ancho del panel; margin negativo la apoya sobre el padding inferior del panel */
.cvomega_barra{
	margin-bottom:-1em;
	background-color:#17466e;
	}

.cvomega_barra_int{
	max-width:76em;
	margin:0 auto;
	padding:0 2em;
	}

/* Emoji de la franja SOPORTE HUMANO: 20px, sin espaciado de letras heredado */
.cvomega_barra_emoji{
	font-size:20px;
	line-height:1;
	letter-spacing:0;
	margin-right:0.5em;
	}

.nav_section_header ul,
.nav_section_solapas ul{
	margin:0;
	padding:0;
	}

.nav_section_solapas{
	max-width:100%;
	width:100%;
	display:inline-block;
	margin-top:-0.9375em;
	padding-bottom:0.3125em;
	}

.nav_section_header li,
.nav_section_solapas li{
	float:left;
	display:block;
	margin:0.3125em;
	padding:0;
	}

.nav_section_header li{
	font-size:0.8125em; /* 13px; antes 11px */
	letter-spacing:0.04em;
	line-height:1.2em;
	}

/* Breadcrumb*/
.brc_casa{
	display:inline-block;
	width:1.25em;
	height:1.25em;
	vertical-align:-0.3em;
	color:#333333;
	}

.nav_section_header li a:hover .brc_casa{
	color:#ffffff;
	}

.brc_sep{
	display:inline-block;
	width:1.1em;
	height:1.1em;
	margin-left:0.45em;
	vertical-align:-0.25em;
	color:#9a9a9a;
	}

.brc_oculto{
	position:absolute;
	width:1px;
	height:1px;
	overflow:hidden;
	clip:rect(0 0 0 0);
	white-space:nowrap;
	}

.nav_section_solapas li{
	font-size:0.75em;
	}

.nav_section_header li a:hover,
.nav_section_solapas li a:hover{
	color:#ffffff !important;
	background-color:#0e67a8 !important;
	}

.head_solapa{
	background-color:#eef3f4;
	margin-left:-0.25em !important;
	margin-right:-0.3125em !important;
	margin-bottom:2em;

	padding-left:0.5em;
	padding-top:0.7em;
	padding-right:0.5em;
	padding-bottom:0em;

	border-bottom: 0.125em solid #f6c119;

	background: rgba(245,248,248,1);
	background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(238,243,244,1) 14%, rgba(238,243,244,1) 100%);
	background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255,255,255,1)), color-stop(14%, rgba(238,243,244,1)), color-stop(100%, rgba(238,243,244,1)));
	background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(238,243,244,1) 14%, rgba(238,243,244,1) 100%);
	background: -o-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(238,243,244,1) 14%, rgba(238,243,244,1) 100%);
	background: -ms-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(238,243,244,1) 14%, rgba(238,243,244,1) 100%);
	background: linear-gradient(to bottom, rgba(255,255,255,1) 0%, rgba(238,243,244,1) 14%, rgba(238,243,244,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#eef3f4', GradientType=0 );
	}

.head_solapa h2{
	margin-top:0;
	padding-left:0.1em;
	}

.cajadevideo{
    max-width:35em;
    margin:auto;
	z-index:1;
	}

.video{
    height:0;
    width:100%;
    max-width:35em;
    padding-top:56.25%;
    position:relative;
	}

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

.scrolltop {
    display: none;
	}

.img_transition, .img_transition_shadow, .img_transition_big {
	-webkit-transition:.2s;
	-moz-transition:.2s;
	-transition:.2s;
	padding-bottom:0.625em;
   	border-bottom: 0.0625em solid #666666;
	}

.img_transition:hover {
	-webkit-transform:scale(1.05);
	-moz-transform:scale(1.05);
	transform:scale(1.05);
	background-color:rgba(191, 225, 250, 0.4);
	border: none;
	}

.img_transition_big:hover {
	-webkit-transform:scale(1.5);
	-moz-transform:scale(1.5);
	transform:scale(1.5);
	margin:1em;
	}

.img_transition_shadow:hover {
	-webkit-transform:scale(1.05);
	-moz-transform:scale(1.05);
	transform:scale(1.05);
	box-shadow:0 0 0.625em 0 black;
	}

.secureimage{
	border: 0.1em solid #666666;
	border-radius: 0.3em;
	margin-top:0.3em;
	margin-bottom:1em;

	box-shadow: 0 0.25em 0.25em #CCC;
	-moz-box-shadow: 0 0.25em 0.25em #CCC;
	-webkit-box-shadow: 0 0.25em 0.25em #CCC;
	}

.inputs_form_rsp{
	max-width:95%;
	width:95%;
	display:inline-block;
	margin-bottom:1.5em;

	padding-top:0.5em;
	padding-bottom:0.5em;
	padding-left:0.3em;
	padding-right:0.3em;

	font-size:1em;
	font-family:Arial, Helvetica, sans-serif;
	color:#0e67a8;
	border-radius: 0.3125em;
	-moz-border-radius: 0.3125em;
	-webkit-border-radius: 0.3125em;
	-khtml-border-radius: 0.3125em;
	}

.btn_semiTransparente {
	display:inline-block;
	height: 50px;
	width:200px;
	font-size:20px;
	margin-top:10px;
	margin-bottom:20px;
	vertical-align: middle;

	cursor:pointer; cursor: hand;

	background-color:#ffffff;

	padding:10px;

	border: 1px solid #999999;

	color:#333;

	opacity: 0.6;
	filter: alpha(opacity=60);

	border-radius: 0.3125em;
	-moz-border-radius: 0.3125em;
	-webkit-border-radius: 0.3125em;
	-khtml-border-radius: 0.3125em;

	box-shadow: 0 0.125em 0.25em #666666;
	-moz-box-shadow: 0 0.125em 0.25em #666666;
	-webkit-box-shadow: 0 0.125em 0.25em #666666;
	}

.btn_semiTransparente:hover{
opacity: 1;
filter: alpha(opacity=100);
color:#ffffff;

background: radial-gradient(ellipse farthest-corner at right bottom, #FEDB37 0%, #FDB931 8%, #9f7928 30%, #8A6E2F 40%, transparent 80%),
			radial-gradient(ellipse farthest-corner at left top, #FFFFFF 0%, #FFFFAC 8%, #D1B464 25%, #5d4a1f 62.5%, #5d4a1f 100%);
			transition:.8s;
			-webkit-transition:.8s;
			-moz-transition:.8s;
			-transition:.8s;
}

.btn_form_rsp {
	border: 0.0625em #006699 solid;
	background-color: #E6E7EE;
	font-size: 1em;
	color: #004364;

	border-radius: 0.3125em;
	-moz-border-radius: 0.3125em;
	-webkit-border-radius: 0.3125em;
	-khtml-border-radius: 0.3125em;

	box-shadow: 0 0.125em 0.25em #666666;
	-moz-box-shadow: 0 0.125em 0.25em #666666;
	-webkit-box-shadow: 0 0.125em 0.25em #666666;

	padding-top: 0.125em;
	padding-bottom: 0.125em;
	padding-left: 0.625em;
	padding-right: 0.625em;

	margin:0,3125em;

	text-shadow:0 0.0625em 0 #FFFFFF;
	}

.btn_form_rsp:hover{
	background-color: #FFFFFF;
	outline:0;
	cursor:pointer; cursor: hand;

	box-shadow: none;
	-moz-box-shadow: none;
	-webkit-box-shadow: none;

	font-weight:bold;
	}

/*----------------------*/
/* Colores de fondo     */
/*----------------------*/
.fondo_gris_cvo{
	background-color:#F3F4F5;
	}

.fondo_celeste_cvo{
	background-color:#eaf2f2;
	}

/*----------------------*/
/* RESALTADORES          */
/*----------------------*/
mark,
.resaltador_amarillo,
.resaltador_azul,
.resaltador_verde,
.resaltador_celeste,
.resaltador_rojo{
	padding:2px;
	padding-left:1px;
	padding-right:1px;
	line-height: 150%;
	}

mark,
.resaltador_amarillo{
	background-color:#ffe86b;
	color: #333333;
	padding:0.05em 0.25em;
	border-radius:0.2em;
	}

.resaltador_azul{
	background-color:#297cb9;
	color:#ffffff;
	}

.resaltador_verde{
	background-color:#5bfd03;
	color: #404040;
	}

.resaltador_celeste{
	background-color:#00fcff;
	color: #404040;
	}

.resaltador_rojo{
	background-color:#CC3333;
	color: #ffffff;
	}

/*----------------------*/
/* Colores para fuentes */
/*----------------------*/
.color-dorado{
	color:#dbb85a;
	}

/* Naranja
----------------------*/
.orange{
	color: #CC9900;
	}

.orange_fuerte {
	color: #FF9900;
	}

/* Azul
----------------------*/
.blue{
	color: #006dba;
	}

/* Verde
----------------------*/
.green{
	color: #52AF2D;
	}

/* Celeste
----------------------*/
.celeste{
	color: #80A8C3;
	}

/* Rojo
----------------------*/
.fuente_roja{
	color: #CC3333;
	}

/* Gris
----------------------*/
.fuente_gris, .gris{
	color: #a19e9e;
	}

/* Violeta
----------------------*/
.fuente_violeta{
	color: #80309E;
	}

/* Blanca
----------------------*/
.fuente_blanca{
	color: #a09f9f;
	}

.div_separador{
	width: 100%;
	height: 3em;
	background-color: #F3F4F5;
	margin-top: 3em;
	margin-bottom: 2.5em;
	border-radius: calc(infinity * 1px);
}

/*------------------------------------------*/
/* Cajas contenedoras de los tips           */
/*------------------------------------------*/
/* Generalizades de los contenedores*/
.div_contenedor_tips_ambar a,
.div_contenedor_tips_verde a,
.div_contenedor_tips_celeste a,
.div_contenedor_tips_marron a,
.div_contenedor_tips_ambar ul,
.div_contenedor_tips_ambar li,
.div_contenedor_tips_ambar p,
.div_contenedor_tips_verde p,
.div_contenedor_tips_celeste p,
.div_contenedor_tips_marron p,{
	font-size: 0.875em;
	margin-top:0.5em;
	margin-bottom:0.5em;
	}

/* Generalizades de los contenedores*/
.div_contenedor_tips_ambar h2,
.div_contenedor_tips_verde h2,
.div_contenedor_tips_celeste h2,
.div_contenedor_tips_marron h2,
.div_contenedor_tips_ambar h3,
.div_contenedor_tips_verde h3,
.div_contenedor_tips_celeste h3,
.div_contenedor_tips_marron h3{
	background: none !important;
	padding:0 !important;

	margin-left:0 !important;
	margin-right:0 !important;
	margin-bottom:1.5em !important;
	margin-top: 1em !important;

	border: 0 !important;
	display: block !important;

	box-shadow: none !important;
	-moz-box-shadow: none !important;
	-webkit-box-shadow: none !important;
	}

.div_contenedor_tips_ambar h2,
.div_contenedor_tips_verde h2,
.div_contenedor_tips_celeste h2,
.div_contenedor_tips_marron h2,
.div_contenedor_tips_ambar h3,
.div_contenedor_tips_verde h3,
.div_contenedor_tips_celeste h3,
.div_contenedor_tips_marron h3{
	font-size:1.1em;
	font-weight:bold;
	}

.div_contenedor_tips_ambar,
.div_contenedor_tips_verde,
.div_contenedor_tips_celeste,
.div_contenedor_tips_marron{

	border-radius: 0.3125em;
	-moz-border-radius: 0.3125em;  /* Firefox */
	-webkit-border-radius: 0.3125em; /* Chrome/Safari */
	-khtml-border-radius: 0.3125em; /* Linux browsers */

	box-shadow: 0 0.125em 0.25em #666666;
	-moz-box-shadow: 0 0.125em 0.25em #666666;
	-webkit-box-shadow: 0 0.125em 0.25em #666666;

	background-color:#FFF;

	border: 0.0625em solid;

	max-width: 50em;
	background-color:#FFF;
	padding:0.0625em;

	margin-left:auto; margin-right:auto;
	margin-top:2em;
	margin-bottom:2em;
	}

.div_contenedor_tips_ambar ul,
.div_contenedor_tips_ambar li,
.div_contenedor_tips_celeste ul,
.div_contenedor_tips_celeste li,
.div_contenedor_tips_verde ul,
.div_contenedor_tips_verde li,
.div_contenedor_tips_marron ul,
.div_contenedor_tips_marron li{
	margin:0.3125em;
	}

/* Particularidades de cada contenedor
---------------------------------------*/
/* TIPS AMBAR */
.div_contenedor_tips_ambar{
	border-color:#9d9627;
	}

.div_contenedor_tips_ambar p,
.div_contenedor_tips_ambar ul,
.div_contenedor_tips_ambar li,
.div_contenedor_tips_ambar a,
.div_contenedor_tips_ambar h2,
.div_contenedor_tips_ambar h3{
	color: #978541 !important;
	}

.div_contenedor_tips_ambar{
	background-color:#f8f7e9;
	}

/* TIPS VERDE  */
.div_contenedor_tips_verde{
	border-color:#617d5b;
	}

.div_contenedor_tips_verde p,
.div_contenedor_tips_verde a,
.div_contenedor_tips_verde h2,
.div_contenedor_tips_verde h3{
	color: #617d3f !important;
	}

.div_contenedor_tips_verde{
	background-color:#dbe3d2;
	}

/* TIPS CELESTE*/
.div_contenedor_tips_celeste{
	border-color:#006699;
	}

.div_contenedor_tips_celeste p,
.div_contenedor_tips_celeste a,
.div_contenedor_tips_celeste h2,
.div_contenedor_tips_celeste h3{
	color: #566f92 !important;
	}

.div_contenedor_tips_celeste{
	background-color:#d9e1ec;
	}

/* TIPS MARRON */
.div_contenedor_tips_marron{
	border-color:#6d5029;
	}

.div_contenedor_tips_marron p,
.div_contenedor_tips_marron a,
.div_contenedor_tips_marron h2,
.div_contenedor_tips_marron h3{
	color: #755831 !important;
	}

.div_contenedor_tips_marron{
	background-color:#ece6df;
	}

.div_scroll_content{
	width:96%;
	height:66.875em;

	background:#fdfbf2;

	border: 0.0625em #e4a84e solid;

    padding: 0.625em;
	-moz-box-shadow: 0.3125em 0.3125em 1em #ccc;
	-webkit-box-shadow: 0.3125em 0.3125em 1em #ccc;
	box-shadow: 0.3125em 0.3125em 1em #ccc;

     min-height: 200px;
     overflow-x: hidden;
     overflow-y: scroll;
     resize: vertical;

	}

/* Div Animacion o Imagen Responsivo*/
.div_rsp_swf_o_img object{
	display:inline;
	}

.div_rsp_swf_o_img img{
	display:none;
	}

.link_solapa{
	-moz-border-radius:0 !important;
	border-bottom-right-radius:0 !important;
	border-bottom-left-radius:0 !important;

	padding-left:1.6875em !important;
	padding-right:1.6875em !important;
	text-align:center;
	}

.div_columna_dos_al_50_porciento,
.div_columna_uno_al_50_porciento{
	max-width:50%;
	width:50%;
	display:inline-block;
	float:left;
	text-align:center;
	}

.div_columna_uno_al_100_porciento a,
.div_columna_uno_al_50_porciento a,
.div_columna_dos_al_50_porciento a{
	padding-left:0;
	padding-right:0;
	max-width:100%;
	width:100%;
	display:inline-block;
	border-radius: 0;
	-moz-border-radius: 0;
	-webkit-border-radius: 0;
	-khtml-border-radius: 0;
}

.div_columna_uno_al_100_porciento{
  display:block;
  text-align:center;
}

/* Banda 1: llamado a la accion (misma luz del fondo del sitio: foco azul arriba, foco ambar abajo); position/overflow contienen el sol de ::before */
.cvofoot_cta{
	position:relative;
	overflow:hidden;
	background-color:#fbfbfb;
	background-image:
		radial-gradient(circle at 50% 0%, rgba(14,103,168,0.14) 0%, rgba(14,103,168,0) 55%),
		radial-gradient(circle at 90% 100%, rgba(255,194,59,0.14) 0%, rgba(255,194,59,0) 45%);
	border-top:0.0625em solid #e8eaec;
	color:#575757;
	text-align:center;
	padding:4em 1em 3.5em 1em;
	}

/* Sol en el horizonte: ocupa toda la banda; el borde INFERIOR de la banda es el horizonte. La imagen
   (sol_horizonte.svg) trae la animacion SMIL: el disco dorado sube, se queda, baja sin ocultarse del todo,
   bucle de 16 s. Sin JS; no recibe clics (pointer-events) */
.cvofoot_cta::before{
	content:"";
	position:absolute;
	left:0;
	right:0;
	top:0;
	bottom:0;
	pointer-events:none;
	/*
	background-image:url(/cvo_files/img_sistema_elearning/iconografia_sap_abap/svg/sol_horizonte.svg);
	background-repeat:no-repeat;
	background-position:bottom center;
	background-size:cover;
	*/
	}

/* El contenido va por encima del sol */
.cvofoot_cta_int{
	position:relative;
	z-index:1;
	max-width:52em;
	margin:0 auto;
	}

.cvofoot_cta_eyebrow{
	font-size:0.75em;
	font-weight:bold;
	letter-spacing:0.22em;
	text-transform:uppercase;
	color:#2975ac;
	margin-bottom:1.2em;
	}

.cvofoot_cta_titulo{
	font-size:2em;
	font-weight:bold;
	line-height:1.25em;
	color:#0e67a8;
	letter-spacing:0.01em;
	margin:0 auto 1.1em auto;
	text-shadow:0.0625em 0.0625em 0 #ffffff, 0.125em 0.125em 0.125em #d5d6d7;
	}

/* Botones: misma receta que a.link_responsivo_modelo2 (amarillo) y modelo3 (gris) */
.cvofoot_cta_botones a{
	display:inline-block;
	text-decoration:none;
	font-weight:bold;
	font-size:0.9375em;
	padding:0.8em 1.6em;
	margin:0.4em;
	border-radius:0.625em;
	-moz-border-radius:0.625em;
	-webkit-border-radius:0.625em;
	box-shadow:0 0.125em 0.25em #999999;
	-moz-box-shadow:0 0.125em 0.25em #999999;
	-webkit-box-shadow:0 0.125em 0.25em #999999;
	}

.cvofoot_btn_primario{
	color:#747373 !important;
	background-color:#f7c84a;
	border:0.0625em solid #ab8111;
	border-bottom:3px solid #ab8111;
	}

.cvofoot_btn_primario:hover{
	color:#9c760f !important;
	background-color:#fade93;
	box-shadow:none;
	-moz-box-shadow:none;
	-webkit-box-shadow:none;
	}

.cvofoot_btn_secundario{
	color:#747373 !important;
	background-color:#e1e1e0;
	border:0.0625em solid #7f8080;
	border-bottom:3px solid #686969;
	}

.cvofoot_btn_secundario:hover{
	background-color:#f3f2f1;
	box-shadow:none;
	-moz-box-shadow:none;
	-webkit-box-shadow:none;
	}

.cvofoot_cta_sub{
	font-size:0.8125em;
	color:#666666;
	margin-top:1.6em;
	line-height:1.6em;
	}

.cvofoot_cta_sub a{
	color:#2975ac !important;
	text-decoration:none;
	border-bottom:0.0625em dashed #f6c119;
	}

.cvofoot_cta_sub a:hover{
	background-color:#bfe1fa;
	}

/* Banda 2: cuerpo en columnas (mismo gris translucido del pie anterior) */
.cvofoot_cuerpo{
	background-color:rgba(191,191,191,0.2);
	color:#575757;
	padding:3em 1em 1em 1em;
	border-top:0.0625em solid #cccccc;
	}

.cvofoot_grid{
	max-width:80em;
	margin:0 auto;
	display:flex;
	flex-wrap:wrap;
	justify-content:space-between;
	}

.cvofoot_col{
	flex:1 1 11em;
	min-width:11em;
	padding:0 1em;
	margin-bottom:2em;
	box-sizing:border-box;
	text-align:left;
	}

/* La columna de marca va en una tarjeta blanca, como los contenedores del sitio */
.cvofoot_col_marca{
	flex:1.7 1 18em;
	min-width:16em;
	padding:1.2em 1.4em;
	margin-right:1.5em;
	background-color:#ffffff;
	border:0.0625em solid #e8eaec;
	border-bottom:0.1875em solid #f6c119;
	border-radius:0.3125em;
	-moz-border-radius:0.3125em;
	-webkit-border-radius:0.3125em;
	box-shadow:0 0.125em 0.25em #cccccc;
	-moz-box-shadow:0 0.125em 0.25em #cccccc;
	-webkit-box-shadow:0 0.125em 0.25em #cccccc;
	align-self:flex-start;
	}

/* Titulo de columna: azul CVO con subrayado amarillo (como la opcion activa del menu) */
.cvofoot_titulo_col{
	display:inline-block;
	font-size:0.875em;
	font-weight:bold;
	letter-spacing:0.14em;
	text-transform:uppercase;
	color:#0e67a8;
	margin:0 0 1.2em 0;
	padding-bottom:0.5em;
	border-bottom:0.1875em solid #f7c149;
	text-shadow:0.0625em 0.0625em 0 #ffffff;
	}

/* Columna de marca */
.cvofoot_marca_head{
	display:table;
	margin-bottom:0.8em;
	}

.cvofoot_marca_logo{
	display:table-cell;
	vertical-align:middle;
	padding-right:0.6em;
	}

.cvofoot_marca_nombre{
	display:table-cell;
	vertical-align:middle;
	font-size:1.0625em;
	font-weight:bold;
	letter-spacing:0.04em;
	color:#0e67a8;
	line-height:1.3em;
	text-shadow:0.0625em 0.0625em 0 #ffffff;
	}

.cvofoot_marca_lema{
	font-size:0.8125em;
	font-weight:bold;
	letter-spacing:0;
	color:#e71919;
	}

.cvofoot_marca_texto{
	font-size:0.875em;
	line-height:1.65em;
	color:#575757;
	margin:0 0 1.2em 0;
	}

.cvofoot_marca_texto a,
.cvofoot_marca_links a{
	color:#2975ac !important;
	text-decoration:none;
	border-bottom:0.0625em dashed #f6c119;
	}

.cvofoot_marca_texto a:hover,
.cvofoot_marca_links a:hover{
	background-color:#bfe1fa;
	}

.cvofoot_marca_links{
	font-size:0.8125em;
	margin-top:0.8em;
	}

/* Iconos de redes: los png grises de 48px tal cual, con el hover de escala del sitio */
.cvofoot_redes a{
	display:inline-block;
	width:2.25em;
	height:2.25em;
	line-height:2.25em;
	margin:0.25em 0.3em 0.25em 0;
	border-radius:50%;
	background-color:#f7f7f7;
	text-align:center;
	vertical-align:middle;
	text-decoration:none;
	border-bottom:0;
	border:0.0625em solid #ffffff;
	box-shadow:0 0.125em 0.25em #cccccc;
	-moz-box-shadow:0 0.125em 0.25em #cccccc;
	-webkit-box-shadow:0 0.125em 0.25em #cccccc;
	-webkit-transition:.2s;
	-moz-transition:.2s;
	transition:.2s;
	}

.cvofoot_redes a img{
	width:1.75em;
	height:1.75em;
	vertical-align:middle;
	border:0;
	}

.cvofoot_redes a:hover{
	background-color:#bfe1fa;
	box-shadow:none;
	-moz-box-shadow:none;
	-webkit-box-shadow:none;
	-webkit-transform:scale(1.15);
	-moz-transform:scale(1.15);
	transform:scale(1.15);
	}

/* Banda 3: barra legal (gris del menu ampliado; padding inferior grande para el boton flotante de soporte) */
.cvofoot_legal{
	background-color:#e9eaea;
	color:#666666;
	padding:1.5em 1em 7em 1em;
	font-size:0.8125em;
	line-height:1.6em;
	border-top:0.0625em solid #cccccc;
	}

.cvofoot_legal_int{
	max-width:80em;
	margin:0 auto;
	padding:0 1em;
	}

.cvofoot_legal_fila{
	display:flex;
	flex-wrap:wrap;
	justify-content:space-between;
	align-items:center;
	padding-bottom:1em;
	margin-bottom:1em;
	border-bottom:0.0625em solid #cccccc;
	}

.cvofoot_legal_copy{
	color:#575757;
	padding:0.3em 1em 0.3em 0;
	}

.cvofoot_legal_links a{
	display:inline-block;
	color:#2975ac !important;
	text-decoration:none;
	border-bottom:0.0625em dashed #f6c119;
	margin-left:1.4em;
	padding:0.3em 0;
	}

.cvofoot_legal_links a:hover{
	background-color:#bfe1fa;
	}

/* CVOREACTOR con los colores de marca que ya usaba el pie anterior */
.cvofoot_cvo{
	color:#0e67a8;
	font-style:oblique;
	}

.cvofoot_reactor{
	color:#db9e18;
	font-style:oblique;
	}

/* Cabecera: titulo + cerrar */
.cvomenu_head{
	display:table;
	width:100%;
	padding:0.75em 1em;
	box-sizing:border-box;
	border-bottom:0.0625em solid #e9eaea;
	background-color:#f7f7f7;
	}

.cvomenu_head_titulo{
	display:table-cell;
	vertical-align:middle;
	font-size:0.75em;
	font-weight:bold;
	letter-spacing:0.2em;
	text-transform:uppercase;
	color:#0e67a8;
	}

.cvomenu_cerrar{
	display:table-cell;
	vertical-align:middle;
	width:2em;
	text-align:right;
	font-size:1.5em;
	line-height:1em;
	color:#999999 !important;
	text-decoration:none;
	}

.cvomenu_cerrar:hover{
	color:#0e67a8 !important;
	}

/* Accesos rapidos: dos botones chatos */
.cvomenu_accesos{
	display:table;
	width:100%;
	padding:0.75em;
	box-sizing:border-box;
	border-bottom:0.0625em solid #e9eaea;
	}

.cvomenu_acceso{
	display:table-cell;
	width:33.33%;
	vertical-align:middle;
	padding:0.7em 0.2em;
	font-size:0.75em;
	line-height:1.3em;
	font-weight:bold;
	text-align:center;
	white-space:nowrap;
	text-decoration:none;
	color:#575757 !important;
	background-color:#f1f2f3;
	border:0.0625em solid #dcdcdc;
	}

.cvomenu_acceso:first-child{
	border-radius:0.375em 0 0 0.375em;
	}

.cvomenu_acceso + .cvomenu_acceso{
	border-left:0;
	}

.cvomenu_acceso:last-child{
	border-radius:0 0.375em 0.375em 0;
	}

.cvomenu_acceso_campus{
	color:#0e67a8 !important;
	}

.cvomenu_acceso:hover{
	background-color:#bfe1fa;
	color:#0e67a8 !important;
	}

/* Secciones (details/summary: acordeon sin javascript) */
.cvomenu_seccion{
	border-bottom:0.0625em solid #e9eaea;
	}

.cvomenu_seccion_titulo{
	position:relative;
	padding:1em 2.4em 1em 1em;
	font-size:0.8125em;
	font-weight:bold;
	letter-spacing:0.12em;
	text-transform:uppercase;
	color:#333333;
	cursor:pointer;
	list-style:none;
	outline:none;
	}

.cvomenu_seccion_titulo::-webkit-details-marker{
	display:none;
	}

/* Chevron: un borde girado, cambia de sentido al abrir */
.cvomenu_seccion_titulo::after{
	content:"";
	position:absolute;
	right:1.2em;
	top:50%;
	width:0.45em;
	height:0.45em;
	margin-top:-0.4em;
	border-right:0.125em solid #999999;
	border-bottom:0.125em solid #999999;
	-webkit-transform:rotate(45deg);
	-moz-transform:rotate(45deg);
	transform:rotate(45deg);
	-webkit-transition:.2s;
	-moz-transition:.2s;
	transition:.2s;
	}

.cvomenu_seccion[open] > .cvomenu_seccion_titulo{
	color:#0e67a8;
	}

.cvomenu_seccion[open] > .cvomenu_seccion_titulo::after{
	margin-top:-0.1em;
	border-color:#0e67a8;
	-webkit-transform:rotate(225deg);
	-moz-transform:rotate(225deg);
	transform:rotate(225deg);
	}

.cvomenu_seccion_titulo:hover{
	background-color:#f7f7f7;
	}

.cvomenu_seccion_cuerpo{
	padding:0 0 0.6em 0;
	}

.cvomenu_subtitulo{
	padding:0.9em 1em 0.3em 1.25em;
	font-size:0.6875em;
	font-weight:bold;
	letter-spacing:0.14em;
	text-transform:uppercase;
	color:#999999;
	}

/* Pie del panel: acceso a toda la propuesta */
.cvomenu_pie{
	padding:1em;
	}

.cvomenu_pie_link{
	display:block;
	padding:0.75em 0.5em;
	text-align:center;
	font-size:0.8125em;
	font-weight:bold;
	text-decoration:none;
	color:#747373 !important;
	background-color:#f7c84a;
	border:0.0625em solid #ab8111;
	border-bottom:3px solid #ab8111;
	border-radius:0.5em;
	}

.cvomenu_pie_link:hover{
	color:#9c760f !important;
	background-color:#fade93;
	}

/* ==========================================================================================================
   MODULOS INTEGRADOS (pagina de carrera): cada modulo en 2 columnas, video o imagen a la izquierda e info a la
   derecha. flex-wrap apila las columnas cuando no entran (movil) sin media query. Sin video ni imagen la info
   ocupa todo el ancho
   ========================================================================================================== */
.cvomod_grid{
	display:flex;
	flex-wrap:wrap;
	align-items:flex-start;
	gap:20px;
	margin:12px 0 0 0;
	padding:16px;
	background-color:#f4f8fc;
	border:1px solid #dbe7f2;
	border-radius:10px;
	}

.cvomod_media{
	flex:1.25 1 340px;
	min-width:0;
	}

.cvomod_media video,
.cvomod_media .cvomod_img{
	display:block;
	width:100%;
	height:auto;
	background-color:#000000;
	border-radius:8px;
	box-shadow:0 6px 18px rgba(23,70,110,0.25);
	}

.cvomod_media a{
	display:block;
	}

.cvomod_info{
	flex:1 1 260px;
	min-width:0;
	padding:14px 18px 18px 18px;
	background-color:#ffffff;
	border-top:4px solid #f6c119;
	border-radius:8px;
	box-shadow:0 2px 10px rgba(23,70,110,0.10);
	}

/* Objetivos: el contenedor expandible (Ampliar / Ver menos) pierde su tarjeta propia dentro de la columna */
.cvomod_info .description-container{
	margin:0 0 6px 0;
	padding:0;
	background-color:transparent;
	border-radius:0;
	box-shadow:none;
	}

.cvomod_objetivos p{
	margin:0 0 8px 0;
	font-size:16px;
	line-height:1.55em;
	}

.cvomod_objetivos .expand-button,
.cvomod_objetivos .collapse-button{
	margin-top:2px;
	padding:6px;
	}

.cvomod_datos{
	list-style:none;
	margin:4px 0 16px 0;
	padding:0;
	border-top:1px dashed #cfe0ee;
	}

.cvomod_datos li{
	display:flex;
	align-items:center;
	gap:10px;
	margin:0;
	padding:9px 0;
	font-size:16px;
	line-height:1.4em;
	border-bottom:1px dashed #cfe0ee;
	}

.cvomod_ico{
	flex:0 0 30px;
	height:30px;
	display:inline-flex;
	align-items:center;
	justify-content:center;
	font-size:16px;
	line-height:1;
	background-color:#eaf4fc;
	border-radius:50%;
	}

.cvomod_bonif .cvomod_ico{
	background-color:#fff4cf;
	}

.cvomod_boton{
	display:block;
	padding:11px 16px;
	font-size:16px;
	font-weight:600;
	line-height:1.3em;
	text-align:center;
	text-decoration:none !important;
	color:#ffffff !important;
	background-color:#0c6db3;
	border-radius:24px;
	box-shadow:0 3px 8px rgba(12,109,179,0.30);
	transition:background-color 0.2s ease;
	}

.cvomod_boton strong{
	color:#f6c119;
	}

.cvomod_boton:hover,
.cvomod_boton:focus{
	background-color:#17466e;
	}

/* ==========================================================================================================
   CAPA "VER PRESENTACION" SOBRE LOS VIDEOS (carrera_v2::getVideoLocal con $input_capa_config)
   Boton que cubre el video (sobre el poster generico): play, foto opcional del instructor y textos. El click
   (cvoVideoVer en functiones_genericas.js) oculta la capa y reproduce con sonido
   ========================================================================================================== */
.cvovid{
	position:relative;
	}

.cvovid_capa{
	position:absolute;
	top:0;
	right:0;
	bottom:0;
	left:0;
	z-index:2;
	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:center;
	gap:8px;
	width:100%;
	margin:0;
	padding:10px;
	font-family:inherit;
	line-height:1.25; /* el contenedor del video tiene line-height:0 */
	color:#ffffff;
	text-align:center;
	text-shadow:0 1px 3px rgba(0,0,0,0.55);
	background:rgba(0,0,0,0.5); /* capa negra al 50%: atenua el poster propio hasta el click (antes vineta suave para el poster generico) */
	border:0;
	border-radius:inherit;
	cursor:pointer;
	-webkit-tap-highlight-color:transparent;
	}

.cvomod_media .cvovid_capa{
	border-radius:8px; /* mismo redondeo que el video del modulo */
	}

/* Play: circulo blanco con triangulo azul */
.cvovid_play{
	display:flex;
	align-items:center;
	justify-content:center;
	width:64px;
	height:64px;
	border-radius:50%;
	background-color:rgba(255,255,255,0.95);
	box-shadow:0 4px 14px rgba(0,0,0,0.35);
	transition:transform 0.2s ease, background-color 0.2s ease;
	}

.cvovid_play:after{
	content:"";
	margin-left:5px;
	border-left:20px solid #0e67a8;
	border-top:12px solid transparent;
	border-bottom:12px solid transparent;
	}

/* Foto del instructor: circulo con borde dorado y play chico en la esquina */
.cvovid_foto{
	position:relative;
	display:block;
	width:84px;
	height:84px;
	}

.cvovid_foto img{
	display:block;
	width:84px;
	height:84px;
	object-fit:cover;
	border:3px solid #f6c119;
	border-radius:50%;
	box-shadow:0 2px 10px rgba(0,0,0,0.40);
	box-sizing:border-box;
	}

.cvovid_foto .cvovid_play{
	position:absolute;
	right:-14px;
	bottom:-8px;
	width:40px;
	height:40px;
	}

.cvovid_foto .cvovid_play:after{
	margin-left:4px;
	border-left-width:13px;
	border-top-width:8px;
	border-bottom-width:8px;
	}

.cvovid_t1{
	display:block;
	font-size:19px;
	font-weight:700;
	}

.cvovid_t2{
	display:block;
	margin-top:-4px;
	font-size:14px;
	font-weight:600;
	opacity:0.92;
	}

.cvovid_capa:hover .cvovid_play,
.cvovid_capa:focus .cvovid_play{
	transform:scale(1.08);
	background-color:#ffffff;
	}

.cvovid_capa:focus{
	outline:none;
	}

.cvovid_capa:focus-visible{
	outline:3px solid #f6c119;
	outline-offset:-3px;
	}

/* Velo oscuro sobre el video al pasar el mouse (refuerza el play) */
.cvovid_capa:before{
	content:"";
	position:absolute;
	top:0;
	right:0;
	bottom:0;
	left:0;
	z-index:-1; /* debajo del play y los textos */
	background-color:rgba(0,0,0,0.38);
	border-radius:inherit;
	opacity:0;
	transition:opacity 0.25s ease;
	}

.cvovid_capa:hover:before,
.cvovid_capa:focus-visible:before{
	opacity:1;
	}

/* Hub de area - Cross Training en un unico marco: plan_carrera::getMensajeSeccionHub envuelve todas las carreras
   cross en <div class="description-container cvohub_cross_marco">; cada carrera conserva su description-container
   (id div_xmod_...) pero sin fondo, sombra ni padding propios, separadas por un filete */
.cvohub_cross_marco > article > .description-container{
	margin:0;
	padding:0 0 20px 0;
	background-color:transparent;
	border-radius:0;
	box-shadow:none;
	}

.cvohub_cross_marco > article + article > .description-container{
	padding-top:20px;
	border-top:1px solid #e3edf5;
	}

/* Menu de secciones en la pagina de la carrera: mismas pildoras que el hub, un poco mas de aire arriba
   (va despues del recuadro de trazabilidad) */
nav.cvo_nav_secciones_carrera{
	padding-top:2.5em;
	padding-bottom:0;
	}

/* Inscripcion destacada (amarillo de marca) */
a.cvohub_solapa.cvo_solapa_cta{
	color:#17466e !important;
	background-color:#f6c119;
	border-color:#e0ad10;
	}

a.cvohub_solapa.cvo_solapa_cta:hover{
	color:#ffffff !important;
	background-color:#0e67a8;
	border-color:#0e67a8;
	}

/* BARRA FIJA: debajo del menu superior (el script le pone el top real); por debajo de los paneles del menu PC
   (z-index 101) y del propio menu (999), para que los desplegables queden por encima */
.cvo_barra_secciones{
	position:fixed;
	left:0;
	right:0;
	top:70px;
	z-index:98;
	/* Degrade amarillo suave de marca: resalta la barra sin competir con el menu superior */
	/* Centro mas claro (antes #ffefbd) */
	background-color:#fffbec;
	background-image:linear-gradient(90deg, #fffef9 0%, #fff9e3 35%, #fff6d8 65%, #fffcf2 100%);
	border-bottom:0.0625em solid #f3d77a;
	box-shadow:0 0.25em 0.75em rgba(219,167,52,0.18);
	opacity:0;
	visibility:hidden;
	-webkit-transform:translateY(-0.75em);
	transform:translateY(-0.75em);
	-webkit-transition:opacity .2s, visibility .2s, -webkit-transform .2s;
	transition:opacity .2s, visibility .2s, transform .2s;
	}

.cvo_barra_secciones.cvo_barra_visible{
	opacity:1;
	visibility:visible;
	-webkit-transform:translateY(0);
	transform:translateY(0);
	}

/* Contenido centrado al ancho de la pagina (#div_pagina_cont_central: 80em); con muchas secciones desliza de costado */
.cvo_barra_int{
	display:flex;
	align-items:center;
	gap:0.25em;
	max-width:80em;
	margin:0 auto;
	padding:0 1em;
	overflow-x:auto;
	-webkit-overflow-scrolling:touch;
	scrollbar-width:none;
	}

.cvo_barra_int::-webkit-scrollbar{
	display:none;
	}

/* Titulo de la pagina al inicio de la barra ("Curso ABAP:"): negrita, azul CVO, 14px; si es muy largo se corta con ... */
.cvo_barra_titulo{
	flex:0 1 auto;
	min-width:6em;
	max-width:22em;
	padding:0 0.75em 0 0;
	font-size:14px;
	font-weight:700;
	line-height:1.3em;
	color:#0e67a8;
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;
	}

a.cvo_barra_item{
	display:inline-block;
	flex:0 0 auto;
	padding:0.8em 1em 0.65em 1em;
	font-size:15px;
	font-weight:600;
	line-height:1.3em;
	white-space:nowrap;
	color:#4a4a4a !important;
	text-decoration:none;
	border-bottom:0.1875em solid transparent;
	-webkit-transition:.2s;
	transition:.2s;
	}

a.cvo_barra_item:hover{
	color:#0e67a8 !important;
	background-color:rgba(255,255,255,0.65);
	border-bottom-color:#0e67a8;   /* filete azul al pasar el mouse, como en la seccion activa */
	}

/* Seccion que se esta leyendo: azul de marca con filete azul (sobre el fondo amarillo el filete amarillo no se ve) */
a.cvo_barra_item.cvo_nav_activo{
	color:#0e67a8 !important;
	border-bottom-color:#0e67a8;
	}

/* Inscripcion: boton amarillo junto a las demas secciones */
a.cvo_barra_item.cvo_barra_cta{
	margin-left:0.5em;
	padding:0.45em 1.4em;
	font-weight:700;
	color:#17466e !important;
	background-color:#f6c119;
	border-bottom:0;
	border-radius:2em;
	box-shadow:0 0.0625em 0.1875em rgba(160,110,0,0.35);
	}

a.cvo_barra_item.cvo_barra_cta:hover{
	color:#ffffff !important;
	background-color:#0e67a8;
	}

a.cvo_barra_item.cvo_barra_cta.cvo_nav_activo{
	box-shadow:0 0 0 0.125em #0e67a8;
	}

/* Otros Cursos <area> (solo en la carrera): boton gris a la derecha que lleva al hub */
a.cvo_barra_item.cvo_barra_hub{
	margin-left:auto;
	padding:0.45em 1.3em;
	font-weight:600;
	color:#4a4a4a !important;
	background-color:#eceeef;
	border:0.0625em solid #c9cdd1;
	border-radius:2em;
	}

a.cvo_barra_item.cvo_barra_hub:hover{
	color:#ffffff !important;
	background-color:#6b7279;
	border-color:#6b7279;
	}

/* ================================================================================================================
   4. ANIMACIONES
   @keyframes usados por las reglas de arriba.
   ================================================================================================================ */

@keyframes runSlider{
    from{
        transform: translateX(0);
    }to{
        transform: translateX(calc(-165px * 11));
    }
}

@keyframes tarjeta_video_sonido_pulso{
	0%, 100%{ box-shadow:0 2px 8px rgba(0,0,0,0.45), 0 0 0 0 rgba(246,193,25,0.65); }
	50%{ box-shadow:0 2px 8px rgba(0,0,0,0.45), 0 0 0 8px rgba(246,193,25,0); }
	}

@-webkit-keyframes cvo_linea_brillo{
	0%{ -webkit-transform:translateX(-100%); }
	2.581%{ -webkit-transform:translateX(334%); }
	2.603%{ -webkit-transform:translateX(-100%); }
	13.118%{ -webkit-transform:translateX(-100%); }
	15.699%{ -webkit-transform:translateX(334%); }
	15.721%{ -webkit-transform:translateX(-100%); }
	33.548%{ -webkit-transform:translateX(-100%); }
	36.129%{ -webkit-transform:translateX(334%); }
	36.151%{ -webkit-transform:translateX(-100%); }
	46.022%{ -webkit-transform:translateX(-100%); }
	48.603%{ -webkit-transform:translateX(334%); }
	48.625%{ -webkit-transform:translateX(-100%); }
	72.473%{ -webkit-transform:translateX(-100%); }
	75.054%{ -webkit-transform:translateX(334%); }
	75.076%{ -webkit-transform:translateX(-100%); }
	86.022%{ -webkit-transform:translateX(-100%); }
	88.603%{ -webkit-transform:translateX(334%); }
	88.625%{ -webkit-transform:translateX(-100%); }
	100%{ -webkit-transform:translateX(-100%); }
}

@keyframes cvo_linea_brillo{
	0%{ transform:translateX(-100%); }
	2.581%{ transform:translateX(334%); }
	2.603%{ transform:translateX(-100%); }
	13.118%{ transform:translateX(-100%); }
	15.699%{ transform:translateX(334%); }
	15.721%{ transform:translateX(-100%); }
	33.548%{ transform:translateX(-100%); }
	36.129%{ transform:translateX(334%); }
	36.151%{ transform:translateX(-100%); }
	46.022%{ transform:translateX(-100%); }
	48.603%{ transform:translateX(334%); }
	48.625%{ transform:translateX(-100%); }
	72.473%{ transform:translateX(-100%); }
	75.054%{ transform:translateX(334%); }
	75.076%{ transform:translateX(-100%); }
	86.022%{ transform:translateX(-100%); }
	88.603%{ transform:translateX(334%); }
	88.625%{ transform:translateX(-100%); }
	100%{ transform:translateX(-100%); }
}

/* ================================================================================================================
   5. MEDIA QUERIES
   Agrupadas por resolucion, de mayor a menor ancho (las de menor ancho pisan a las de mayor); al final las de accesibilidad.
   ================================================================================================================ */

@media all and (max-width: 1375px){
	#div_nav_qr{
		display:none;
		}
}

@media all and (max-width: 1264px){
	/* --------------------------------------------------
	       M E D I A    - Q U E R Y S
	-----------------------------------------------------*/
	#div_pagina_ppal,
	#div_footer{
		margin-left:auto;

		}

	#div_nav_ampl_movil{
		margin:0 !important;
		margin-top:-0.0625em !important;
		opacity:1 !important;
		height:100%;

		display:none;

		border-radius: 0;
		-moz-border-radius: 0;
		-webkit-border-radius: 0;
		-khtml-border-radius: 0;
		border:0;
		}
}

@media all and (max-width: 1100px){
	/* FOOTER V2 - ajustes para tablets y pantallas medias (enlaces a dos columnas, marca ancho completo)*/
	.cvofoot_col{
		flex:1 1 50%;
		min-width:45%;
		}

	.cvofoot_col_marca{
		flex:1 1 100%;
		min-width:100%;
		margin-right:0;
		}
}

@media all and (max-width: 980px){
	.div_rsp_swf_o_img object{
		display:none;
		}

	.div_rsp_swf_o_img img{
		display:inline;
		}
}

@media all and (max-width: 910px){
	.centrado_movil{
		text-align:center;
		}

		#parrafo_head{
		text-align:center;
		}

	#video_local_2cols{
		width: 100%;
	}

	.div_contenedor_tips_ambar,
	.div_contenedor_tips_verde,
	.div_contenedor_tips_celeste,
	.div_contenedor_tips_marron{
		padding-left:6px;
		padding-right:6px;
	}

	/* Contenedor ppal del cuerpo de la pagina*/
	#div_pagina_ppal{
		border-left:0;
		border-right:0;
		margin-top:3.6em;
		}

	/* Menu de navegacion ppal */
	#div_nav_ppal_desktop,
	#div_nav_acciones_desktop{
		 display: none;
		}

	#div_nav_ppal_movil{
		display: inline-block;
		/*position:absolute;*/
		}

	#div_nav_modulos,
	#div_nav_niveles{
		display:block;
		}

	#div_menu_ppal_desktop_logo{
		float:none;
		display:block;
		text-align:center;
		}

	#div_menu_ppal_desktop{
		 padding-top: 0em;
		}

	/*Previene la ocultacion que ocurre en menu a partir de esta resolucion */
	#div_espaciador_primer_fila_pagina{
		height:1em;
		}

	.link_solapa{
		border-bottom-left-radius:0 !important;
		padding-left: 0.6em !important;
		padding-right: 0.6em !important;
		}

	/* Menu de navegacion ppal */
	#menu_der_head{
		 display: none;
		}

	#div_figure img{
		display:inline-block;
		}

	.contenedor_de_audio_jwplayer
	{
		margin:auto;
		text-align:inherit;
		}

	#div_pagina_cont_central
	{
		/*padding:0.1;*/
		}

	/* Todas las cosas que se le asigna esta clase,
		deben deasparecer cuando se alcanza la resolucion para mobiles */
	.hide_for_mobile{
		display:none;
		}

	.show_for_mobile{
		display:inline-block;
		}

	/* Imagenes responsivas deben llevar esta clase */
	figure, .img_rsp{
		max-width: 100%;
		height: auto;

		}

	/* ScrollTop */
	.div_scroll{
		margin-left:-1.2em;

		padding-left:0.5em ;
		padding-bottom:0.2em;
		padding-right:0.2em;
		padding-top:0.2em;
		}

	#div_bottom_scroll a{
		padding:0.5em;
		padding-left:1em;
		padding-right:1em;
		text-align:center;
		margin-bottom:-2px;
	}

	#div_bottom_scroll{
		right: -0.5em;
		/* Si deseo alinear boton al centro, activar las siguientes lineas
		right: 0;
		left: 0;*/
		width: 4.875em;
		z-index:1000;
		opacity:0.85;

		margin:auto;
	}

	/* Menu solapas */
	#div_contenedor_menu_solapas_mobile{
		display:inline;
		}

	/* Contenedor ppal del cuerpo de la pagina */
	#div_pagina_ppal{
		box-shadow: none;
		-moz-box-shadow: none;
		-webkit-box-shadow: none;
		border-bottom: 2px solid #b1cbdd;
		}

	.div_fila_2cols_img_izq-col_izquierda{
		text-align:center;
		display:block;
		width:100% !important;
		margin-left:-5px !important;
		}

	.div_fila_2cols_img_izq-col_derecha{
		display:block;

		}

	.div_fila_2cols_img_der-col_izquierda{
		display:block;

		}

	.div_fila_2cols_img_der-col_derecha{
		text-align:center;
		display:block;
		}

	h1, h2, h3, #div_autor_publicacion p{
		text-align:center;
		}

	div_autor_publicacion p{
		text-align:center;
		}

	h3{
		border-left:0.25em solid #f6c119;
		padding:0.1em 0 0.1em 0.5em;
		margin-top:2em;
		margin-bottom:0.5em;
		text-align:left;
		}

	h2{
		display: block;
		padding-top:0.7em;
		padding-bottom:0.7em;
		padding-left:0.7em;
		padding-right:0;
		}

	.head_solapa h2{
		background:none !important;
		}

	.listado_rsp li{
		margin-top:1.5em;
		margin-bottom:1.5em;
		}

	.listado_rsp{
		margin: 0.3em;
		margin-left:0.7em;
		padding: 0.3em;
		}

	.div_scroll_content{
		overflow:auto;
		height:auto;
		}

	.div_contenedor_video_y_descripcion .div_columna_uno_al_50_porciento{
		display:block;
	  	max-width:100%;
		width:100%;
		padding-top:0 !important;
		}

	.video{
		margin-left:0 !important;
		}

	/* FOOTER V2 - ajustes para moviles (una columna, botones apilados, legal centrado)*/
	.cvofoot_cta{
		padding:3em 1em 2.5em 1em;
		}

	.cvofoot_cta_titulo{
		font-size:1.5em;
		}

	.cvofoot_cta_botones a{
		display:block;
		margin:0.6em auto;
		max-width:18em;
		}

	/* Enlaces a dos columnas; la marca ocupa el ancho completo */
	.cvofoot_col{
		flex:1 1 50%;
		min-width:45%;
		}

	.cvofoot_col_marca{
		flex:1 1 100%;
		min-width:100%;
		margin-right:0;
		}

	.cvofoot_legal_fila{
		display:block;
		text-align:center;
		}

	.cvofoot_legal_copy{
		padding-right:0;
		margin-bottom:0.6em;
		}

	.cvofoot_legal_links a{
		margin:0 0.7em;
		}

	#div_footer .cvofoot_legal p{
		text-align:center;
		}
}

@media all and (max-width: 767px){
	/* Movil y pantallas chicas: sin barra fija (el menu en la pagina sigue, deslizable) */
	.cvo_barra_secciones{
		display:none !important;
		}

	nav.cvo_nav_secciones_carrera{
		padding-top:1.5em;
		}
}

@media all and (max-width: 640px){
	.cvohub_solapas{
		flex-wrap:nowrap;
		justify-content:flex-start;
		overflow-x:auto;
		-webkit-overflow-scrolling:touch;
		padding:1em 0.5em 1.5em 0.5em;
		}

	.cvohub_grid{
		grid-template-columns:1fr;
		}

	.cvohub_tarjeta_titulo_cab{
		width:52%;
		font-size:1.2em;
		}
}

@media (max-width:480px){
	.tarjeta_video_sonido{
		top:6px;
		left:6px;
		padding:5px 11px 5px 9px;
		font-size:13px;
		}

	.cvomod_grid{
		gap:12px;
		padding:10px;
		}
	.cvomod_info{
		padding:12px 14px 14px 14px;
		}

	.cvovid_capa{
		gap:6px;
		}
	.cvovid_play{
		width:52px;
		height:52px;
		}
	.cvovid_play:after{
		border-left-width:16px;
		border-top-width:10px;
		border-bottom-width:10px;
		}
	.cvovid_foto,
	.cvovid_foto img{
		width:64px;
		height:64px;
		}
	.cvovid_foto .cvovid_play{
		width:32px;
		height:32px;
		}
	.cvovid_foto .cvovid_play:after{
		border-left-width:11px;
		border-top-width:7px;
		border-bottom-width:7px;
		}
	.cvovid_t1{
		font-size:17px;
		}
	.cvovid_t2{
		font-size:13px;
		}
}

@media (prefers-reduced-motion: reduce){
	.tarjeta_video_sonido.tarjeta_video_sonido_on{ animation:none; }

	.cvovid_play{ transition:none; }

	.cvovid_play{ transition:none; }
	.cvovid_capa:before{ transition:none; }

	.cvo_barra_secciones{
		-webkit-transition:none;
		transition:none;
		}
}