/**
* 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
*         Temario de 10 semanas: bonus destacados, Social Break, circuito de evaluacion de cada unidad y semanas de
*         cierre (repaso, examen final y recuperatorio); #cvo_temario con scroll-margin-top para que las barras fijas no
*         tapen el inicio de la seccion al llegar por ancla   -> IA-CHG-CLAUDE | ID: 02NOV2026-03:30:00 | TEMARIO 10 SEMANAS
*         Indicador de desplegable (circulo azul con flecha blanca) en el temario, el modelo academico y el HiperBonus;
*         carrusel de empresas dentro del cuerpo (cvo_carrusel_banda_cuerpo)   -> IA-CHG-CLAUDE | ID: 02NOV2026-15:20:00 | INDICADOR DESPLEGABLE
*         Boton naranja "Planes 50%OFF - Consulte a su asesor" en el pago de un solo modulo   -> IA-CHG-CLAUDE | ID: 02NOV2026-15:50:00 | PROMO PLANES

*
* --------------------------------------------------------------------------------*/

/* 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%);
	}

/* Carrusel dentro del cuerpo (carreras: antes de Certificaciones; hubs: antes de las preguntas frecuentes):
   page::getCarruselEmpresasCuerpoHtml   -> IA-CHG-CLAUDE | ID: 02NOV2026-15:20:00 | CARRUSEL EN CUERPO */
.cvo_carrusel_banda.cvo_carrusel_banda_cuerpo{
	margin:2.5em 0 2.5em 0;
	}

.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;
	}

/* Flecha anterior de "Ver N beneficios": reemplazada por el circulo azul del bloque INDICADOR DE DESPLEGABLE   -> IA-CHG-OFF | CLAUDE | ID: 02NOV2026-15:20:00 | INDICADOR DESPLEGABLE */
/*.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;
	scroll-margin-top:100px;   /* -> IA-CHG-CLAUDE | ID: 02NOV2026-03:30:00 | SCROLL TEMARIO (barras fijas de escritorio: 89px) */
	}

.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;   -> IA-CHG-OFF | CLAUDE | ID: 02NOV2026-15:20:00 | INDICADOR DESPLEGABLE */
	grid-template-columns:28px 1fr auto 26px;   /* -> IA-CHG-CLAUDE | ID: 02NOV2026-15:20:00 | INDICADOR DESPLEGABLE */
	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;
		scroll-margin-top:70px;   /* -> IA-CHG-CLAUDE | ID: 02NOV2026-03:30:00 | SCROLL TEMARIO (barra fija de celular: 59px) */
		}

	.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 */

/* TEMARIO 10 SEMANAS: BONUS, EVALUACION Y SEMANAS DE CIERRE   -> IA-CHG-CLAUDE | ID: 02NOV2026-03:30:00 | TEMARIO 10 SEMANAS
   defCarreraTemarioSemanaHtml: en cada unidad, los cursos del HiperBonus destacados (fila dorada con "Bonus"),
   el Social Break con etiqueta celeste y, como ultima linea con tilde verde, el circuito de evaluacion de la unidad.
   Debajo de las unidades, separadas, las semanas de cierre: repaso, examen final y recuperatorio */
.cvo_temario_cifras span.cvo_temario_cifra_bonus{
	background-color:rgba(246,193,25,0.2);
	color:#f6c119;
	}

.cvo_temario_cifras span.cvo_temario_cifra_bonus b{
	color:#ffd34d;
	}

.cvo_temario_unidad > summary small i{
	font-style:normal;
	}

.cvo_temario_mas_bonus{
	display:inline-block;
	margin-left:4px;
	padding:1px 7px;
	border-radius:2em;
	background-color:#fff3c4;
	font-size:11.5px;
	font-weight:700;
	color:#8a6400;
	}

.cvo_temario .cvo_temario_det li.cvo_temario_li_bonus,
.cvo_temario .cvo_temario_det li.cvo_temario_li_social,
.cvo_temario .cvo_temario_det li.cvo_temario_li_eval{
	list-style:none;
	margin:6px 0 4px -18px;
	padding:6px 10px;
	border-radius:8px;
	}

.cvo_temario .cvo_temario_det li.cvo_temario_li_bonus{
	border-left:3px solid #f6c119;
	background-color:#fff8e0;
	font-weight:600;
	color:#5c4500;
	}

.cvo_temario .cvo_temario_det li.cvo_temario_li_social{
	background-color:#eef5fb;
	color:#2b3238;
	}

.cvo_temario_det li em{
	display:inline-block;
	margin-right:8px;
	padding:1px 8px;
	border-radius:2em;
	font-size:11px;
	font-style:normal;
	font-weight:700;
	letter-spacing:0.04em;
	text-transform:uppercase;
	}

.cvo_temario_li_bonus em{
	background-color:#f6c119;
	color:#3a2c00;
	}

.cvo_temario_li_social em{
	background-color:#cfe2f3;
	color:#0e4f80;
	}

/* Destacados de las semanas de cierre: entrega del manual (repaso) y avance al proximo nivel (recuperatorio) */
.cvo_temario .cvo_temario_det li.cvo_temario_li_destacado{
	list-style:none;
	margin:10px 0 4px -18px;
	padding:10px 12px;
	border-left:3px solid #0e67a8;
	border-radius:8px;
	background-color:#eef5fb;
	color:#2b3238;
	}

.cvo_temario_li_destacado b{
	color:#0e4f80;
	}

.cvo_temario .cvo_temario_det li.cvo_temario_li_avance{
	border-left-color:#f6c119;
	background-color:#fff8e0;
	}

.cvo_temario_li_avance b{
	color:#7a5d00;
	}

.cvo_temario .cvo_temario_det li.cvo_temario_li_eval{
	margin-top:10px;
	border:1px dashed #9fd1b4;
	background-color:#f1faf4;
	font-weight:600;
	color:#1f6b40;
	}

.cvo_temario_li_eval i{
	margin:0 6px;
	font-style:normal;
	color:#5aa77a;
	}

.cvo_temario_li_eval b{
	font-weight:700;
	}

.cvo_temario .cvo_temario_det li.cvo_temario_li_eval::before{
	content:"\2713";
	display:inline-block;
	width:18px;
	height:18px;
	margin-right:8px;
	border-radius:50%;
	background-color:#1f8a4c;
	font-size:12px;
	line-height:18px;
	text-align:center;
	color:#ffffff;
	}

.cvo_temario_sep{
	padding:12px 18px 6px 18px;
	border-top:1px solid #e3e6ea;
	background-color:#fbfaf6;
	font-size:11.5px;
	font-weight:700;
	letter-spacing:0.12em;
	text-transform:uppercase;
	color:#9a7a1c;
	}

.cvo_temario_cierre{
	background-color:#fbfaf6;
	}

.cvo_temario_cierre > summary b{
	display:grid;
	place-items:center;
	width:24px;
	height:24px;
	border-radius:50%;
	background-color:#f6c119;
	font-size:13px;
	color:#3a2c00;
	}

.cvo_temario_c_examen > summary b{
	background-color:#0e67a8;
	color:#ffffff;
	}

.cvo_temario_tag{
	display:inline-block;
	padding:1px 8px;
	border-radius:2em;
	background-color:#f3ead0;
	font-size:11px;
	font-weight:700;
	letter-spacing:0.04em;
	text-transform:uppercase;
	color:#7a5d00;
	}

.cvo_temario_c_examen .cvo_temario_tag{
	background-color:#dbe9f6;
	color:#0e4f80;
	}

.cvo_temario_pie a{
	color:#ffffff !important;
	text-decoration:underline;
	text-decoration-color:#f6c119;
	text-underline-offset:3px;
	}

/* FIN TEMARIO 10 SEMANAS   -> IA-CHG-CLAUDE | ID: 02NOV2026-03:30:00 | TEMARIO 10 SEMANAS */

/* INDICADOR DE DESPLEGABLE   -> IA-CHG-CLAUDE | ID: 02NOV2026-15:20:00 | INDICADOR DESPLEGABLE
   Circulo azul con flecha blanca en todo lo que se despliega para ver mas: unidades del temario, pilares del modelo
   academico ("Ver N beneficios") y cursos del HiperBonus. Gira al abrir. La flecha es un SVG embebido (sin archivo) */
.cvo_temario_unidad > summary::after,
.cvo_bonus_curso > summary::after,
.cvo_modelo_mas::after{
	content:"";
	-webkit-box-flex:0;
	flex:0 0 auto;
	width:26px;
	height:26px;
	border-radius:50%;
	background:#0e67a8 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 10l5 5 5-5' fill='none' stroke='%23ffffff' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 16px 16px no-repeat;
	box-shadow:0 2px 6px rgba(14,103,168,0.3);
	-webkit-transition:-webkit-transform 0.2s ease, background-color 0.2s ease;
	transition:transform 0.2s ease, background-color 0.2s ease;
	}

.cvo_temario_unidad > summary:hover::after,
.cvo_bonus_curso > summary:hover::after,
.cvo_modelo_pilar > summary:hover .cvo_modelo_mas::after{
	background-color:#0a4f82;
	}

.cvo_temario_unidad[open] > summary::after,
.cvo_bonus_curso[open] > summary::after,
.cvo_modelo_pilar[open] .cvo_modelo_mas::after{
	-webkit-transform:rotate(180deg);
	transform:rotate(180deg);
	}
/* FIN INDICADOR DE DESPLEGABLE   -> IA-CHG-CLAUDE | ID: 02NOV2026-15:20:00 | INDICADOR DESPLEGABLE */

/* PROMO PLANES DE CARRERA EN EL PAGO DE UN SOLO MODULO   -> IA-CHG-CLAUDE | ID: 02NOV2026-15:50:00 | PROMO PLANES
   plan_carrera.class.php (getPlanesTarjetas, modo un solo plan): boton naranja con letras azules debajo de la tarjeta
   de inscripcion, al contacto con el asesor (que ofrece un plan de carrera con bonificacion) */
.cvo_planes_promo{
	max-width:520px;
	margin:18px auto 0 auto;
	text-align:center;
	}

a.cvo_plan_btn_promo{
	display:block;
	padding:14px 20px;
	border-radius:12px;
	background:linear-gradient(180deg, #ffb340 0%, #ff9800 100%);
	box-shadow:0 10px 24px rgba(0,20,50,0.28), inset 0 -2px 0 rgba(0,0,0,0.12);
	font-size:17px;
	font-weight:700;
	line-height:1.3;
	text-decoration:none;
	color:#0b3f6b !important;
	-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_promo:hover,
a.cvo_plan_btn_promo:focus{
	-webkit-transform:translateY(-2px);
	transform:translateY(-2px);
	box-shadow:0 14px 28px rgba(0,20,50,0.34), inset 0 -2px 0 rgba(0,0,0,0.12);
	color:#0b3f6b !important;
	text-decoration:none;
	}
/* FIN PROMO PLANES   -> IA-CHG-CLAUDE | ID: 02NOV2026-15:50:00 | PROMO PLANES */

/* 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;   -> IA-CHG-OFF | CLAUDE | ID: 02NOV2026-15:20:00 | INDICADOR DESPLEGABLE */
	grid-template-columns:auto 1fr auto 26px;   /* -> IA-CHG-CLAUDE | ID: 02NOV2026-15:20:00 | INDICADOR DESPLEGABLE */
	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;
		}
}
