@CHARSET "UTF-8";

:root {
	
	--paneles-color: #f8f5f5;
	--border-radius: 5px;
	--border-radius-pmce: 8px;
	--border-radius-link-pmce: 5px;
	--border-radius-main: 10px;
	--grid-gap: 5px;
	--grid-gap-main: 10px;
	--grid-padding: 5px;
	--grid-padding-pmce: 11px;
	--grid-padding-link-pmce: 3px 6px 3px 6px;
	--grid-margin-link-pmce: 2px;
	--grid-padding-main: 12px;
	--grid-margin-pmce: 8px;
	--control-padding-height: 5px;
	--control-padding-width: 8px;
	--font-family: Calibri, Helvetica, Open Sans;
	--font-size: 10pt;
	--font-family-control: Calibri, Helvetica, Open Sans;
	--font-size-control: 10pt;
	--pmce-score: none;
	
}

* {
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
	outline: none;
}

/* Optional: Makes the sample page fill the window. */
html, body {
	font-family: var(--font-family);
	font-size: var(--font-size);
	height: 100%;
	margin: 0;
	padding: 0;
	width: 100%;
}

/* Always set the map height explicitly to define the size of the div
* element that contains the map. */
#portal {
	height: 100%;
    margin: 0;
    border-radius: var(--border-radius);
}

.infowindow {
	margin: 8px;
	font-size: 1.0em;
}

.nombreinfowindow {
	font-size: 1.1em;
}

.icono_png_div {
	display: flex;
}

.icono_png_img {
	margin: 2px;
	width: 26px;
	height: 26px;
}

.icono_png_text {
	
	margin: 5px;
	
}


.grid_A {
	display: grid;
	grid-template-columns: 100%;
	grid-template-rows: 2fr 96fr 2fr;
	width: 100vw;
	height: 93vh;
	grid-gap: var(--grid-gap);
	padding: var(--grid-padding);
	border-radius: var(--border-radius);
}

.grid_A_cabecera {
	background-color: var(--paneles-color);
	border-radius: var(--border-radius);
	padding: var(--grid-padding);
}

.grid_A_cuerpo {
	background-color: var(--paneles_color);
	border-radius: var(--border-radius);
}

.fondo_imagen_portal::before{
	content: ''; /* Necesario para que el pseudo-elemento aparezca */
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
    opacity: 0.2; /* Efecto de opacidad */
    z-index: -1;
	animation: switch-background 60s infinite;
    filter: blur(2px); /* Aplicar desenfoque inicial */
}

@keyframes switch-background {
    0% {
		background-image: url('fondo/fondo1.jpg?v2');
		opacity: 0;
    }
    2% {
		background-image: url('fondo/fondo1.jpg?v2');
		opacity: 0.2;
    }
	47% {
		background-image: url('fondo/fondo1.jpg?v2');
		opacity: 0.2;
    }
	49% {
		background-image: url('fondo/fondo1.jpg?v2');
		opacity: 0;
    }
	50% {
		background-image: url('fondo/fondo2.jpg?v2');
		opacity: 0;
    }
	52% {
		background-image: url('fondo/fondo2.jpg?v2'); 
		opacity: 0.2;
    }
    98% {
		background-image: url('fondo/fondo2.jpg?v2');
		opacity: 0.2;
    }
    100% {
  		background-image: url('fondo/fondo2.jpg?v2');
		opacity: 0;    
	  
    }
  }

.grid_A_pie {
	background-color: var(--paneles_color);
	border-radius: var(--border-radius);
	padding: var(--grid-padding);
	color: grey;
	font-size: 0.8em;
}

.tarjeta_li_pmce {
	margin: 0px 0px 8px 0px;
}

.grid_tarjeta {
	display: grid;
	grid-template-rows: 2fr 96fr 2fr;
	width: 100%;
	height: 100%;
	grid-gap: var(--grid-gap);
	padding: var(--grid-padding);
	border-radius: var(--border-radius);
}

.grid_tarjeta_cabecera {
	background-color: var(--paneles-color);
	border-radius: var(--border-radius);
	padding: var(--grid-padding);
}

.grid_tarjeta_cuerpo {
	background-color: var(--paneles_color);
	border-radius: var(--border-radius);
	padding: var(--grid-padding);
	overflow: scroll;
    overflow-x: hidden;
    overflow-y: auto;
}

.overflowyhiden {
	overflow-y: hidden;
}

.1row {
	grid-template-rows: 1fr;
}

.grid_tarjeta_pie {
	background-color: var(--paneles_color);
	border-radius: var(--border-radius);
	padding: var(--grid-padding);
	color: grey;
	font-size: 0.8em;
}

.control_editbuscar {
	font-family : var(--font-family-control);
	font-size : var(--font-size-control);
	border-radius: var(--border-radius);
	padding-top: var(--control-padding-height);
	padding-bottom: var(--control-padding-height);
	padding-left: var(--control-padding-width);
	padding-right: var(--control-padding-width);
	margin: 3px;
    background-color: white;
    color: black;
	border: none;
	width: 300px;
}

.control_checkbox {
	font-family : var(--font-family-control);
	font-size : var(--font-size-control);
	border-radius: var(--border-radius);
	padding-top: var(--control-padding-height);
	padding-bottom: var(--control-padding-height);
	padding-left: var(--control-padding-width);
	padding-right: var(--control-padding-width);
	margin: 3px;
    background-color: white;
    color: black;
	border: none;
}

.control_text {
	font-family : var(--font-family-control);
	font-size : var(--font-size-control);
	border-radius: var(--border-radius);
	padding-top: var(--control-padding-height);
	padding-bottom: var(--control-padding-height);
	padding-left: var(--control-padding-width);
	padding-right: var(--control-padding-width);
	margin: 3px;
    background-color: none;
    color: black;
	border: none;
}

.control_button {
	font-family : var(--font-family-control);
	font-size : var(--font-size-control);
	border-radius: var(--border-radius);
	padding-top: var(--control-padding-height);
	padding-bottom: var(--control-padding-height);
	padding-left: var(--control-padding-width);
	padding-right: var(--control-padding-width);
	margin: 3px;
    background-color: #6973ee;
    color: white;
	border: none;
	cursor: pointer;
}

.grayedout {
	background-color: #ecebeb !important;
	color: cadetblue !important;
}

.hover_naranja:hover {

    background-color: #e67e22; 
	color: white;
    cursor: pointer; 
}

.hover_naranja:hover * {

    background-color: #e67e22; 
	color: white;
    cursor: pointer; 
}

.control_quitarfiltro {
	font-family : var(--font-family-control);
	font-size : var(--font-size-control);
	border-radius: var(--border-radius);
	padding-top: var(--control-padding-height);
	padding-bottom: var(--control-padding-height);
	padding-left: var(--control-padding-width);
	padding-right: var(--control-padding-width);
	margin: 3px;
    background-color: #f5c978;
    color: color: #888686;
	border: none;
	cursor: pointer;
}

.x_boton {
    background-color: #a1a7f0;
}

.x_tipo {
    background-color: #e4b4af;
}

.x_contenido {
    background-color: #f2e2d4;
}

.x_fondopersonal {
    background-color: #aad4f6;
}

.x_fondoinstitucional {
    background-color: #aeebe6;
}

.x_entidad {
    background-color: #1cd4e3;
}


.unicodeicon {
	color: white;
	font-weight: bold;
}

.inlineblock {
	display: inline-block;
}

.block {
	display: block;
}

.inlineflex {
	display: inline-flex;
}

.displaynone {
	display: none;
}

.displaygrid {
	display: grid;
}

.zindexlow {
	z-index: 0;
}

.zindexhigh {
	z-index: 99;
}

.reducefont {
	font-size: 0.8em;
}

.minireducefont {
	font-size: 0.9em;
}

.reducefont2 {
	font-size: 0.6em;
}

.littleincreasefont {
	font-size: 1.12em;
}

.increasefontbuttonbar {
	font-size: 1.12em;
}

.increasefont {
	font-size: 1.2em;
}

.superfontsize {
	font-size: 2em;
}

.hr{
	border-style: solid;
    border-color: #e4e2e2;
    border-width: thin;
}

.disabled {
	opacity: 0.5;
}

.color_darkgrey {
	color: #313335;
}

.color_dimmed {
	color: #878788;
}

.color_red {
	color: red;
}

.color_tipo_archivo {
	background-color: #539eb6;
}

.color_tipo_biblioteca {
	background-color: #cb741e;
}

.color_tipo_archivo-sonoro {
	background-color: #b8a20b;
}

.color_tipo_centro-de-documentacion {
	background-color: #1f6138;
}

.color_tipo_museo {
	background-color: #8a16dc;
}

.color_tipo_otros {
	background-color: #bd1373;
}

.color_tipocontenido {
	background-color: #6973ee;
}

.color_fondopersonal {
	background-color: #2b4ca4;
}

.color_fondoinstitucional {
	background-color: #2b7299;
}

.color_entidad {
	background-color: #2b7299;
}

.printericon {
	width: 14px;
}

.tarjeta {
	opacity: 0.98;
    display: block;
    width: 90vw;
	height: 80vh;
	max-width: 1200px;
    background-color: white;
    border-radius: 5px;
    padding: 5px;
	margin: auto;
	overflow: hidden;
}

.tarjeta_ficha {
	opacity: 0.98;
    display: block;
    width: 90vw;
	height: 88vh;
	max-width: 900px;
    background-color: white;
    border-radius: 5px;
    padding: 5px;
	margin: auto;
	overflow: hidden;
}

.fullscreen {
	max-width: 100vw;
    width: 99vw;
    height: 93vh;
	padding: 0px;
	background-color: rgba(99,99,99,0.5);
	margin: auto;
	display: block;
}

.fullscreencuerpo {
	overflow: hidden;
	padding: 0px;
}

.grid_wraper {
	display: grid;
	grid-column: 1;
	grid-row:2;
	width: 100vw;
	height: 100vh;
}

.grid_top {
	display: grid;
	grid-column: 2;
	grid-row:1;
	width: 100%;
	height: 7vh;
}

.overflowhidden {
	overflow: hidden
}

.grid_wraper_cabecera {	
	height: 7vh;
	overflow: hidden;
	background-color: #c63334;
}

.grid_wraper_cuerpo {
	height: 93vh;
}

.grid_wraper_pie {
	height: 0vh;
}

.logo-inaem {
	height:7vh;
}

.logo-cdaem {
	height: 7vh;
    padding: 2px;
    border-radius: 5px;
}

.shadow {
	-webkit-box-shadow: 0px 0px 18px 2px rgba(99,99,99,0.45);
	-moz-box-shadow: 0px 0px 18px 2px rgba(99,99,99,0.45);
	box-shadow: 0px 0px 18px 2px rgba(99,99,99,0.45);
}

.littleshadow {
	-webkit-box-shadow: 2px 2px 3px 0px rgba(99,99,99,0.25);
	-moz-box-shadow: 2px 2px 3px 0px rgba(99,99,99,0.25);
	box-shadow: 2px 2px 3px 0px rgba(99,99,99,0.25);
}

.backgroundred {
	background: red;
}

.grid_titulo {
	display:grid;
	grid-template-columns: auto 70px;
	width: 100%;
	height: 100%;
	align-items: center;
}
.grid_titulo_texto {
	margin: auto;
	width: 100%;
}

.grid_titulo_boton {
	text-align: right;
}

.grid_ventana_centrada {
	position:absolute;
	display: grid;
	width: 100%;
	height: 100%;
	/*background-color:rgba(0, 0, 0, 0.5);*/
	z-Index: 1;
	backdrop-filter: blur(3px);
	-webkit-backdrop-filter: blur(3px);
}

.grid_nodo_titulo {
	display:grid;
	grid-template-columns: 1fr;
	grid-gap: var(--grid-gap);
	padding: var(--grid-padding);
	border-radius: var(--border-radius);
	background-color: #1c8b9f;
	
}

.nodo_titulo {
	font-weight: bold;
	font-size: 1.1em;
	color: white;
}

.grid_nodo_contenido {
	display:grid;
	grid-template-columns: 1fr 4fr;
	grid-gap: var(--grid-gap);
	padding: var(--grid-padding);
	border-radius: var(--border-radius);
}

.nodo_etiqueta {
	background-color: #e2f2f5;
	border-radius: var(--border-radius);
	padding: var(--grid-padding);
}

.nodo_valor {
	background-color: white;
	border-radius: var(--border-radius);
	padding: var(--grid-padding);
	overflow-wrap: break-word;
    width: 60vw;
	max-width: 650px;
}

.hyperlinktext {
	color: #5f5f5f;
    font-weight: bold;
	overflow-wrap: break-word;
	word-break: break-word;
	padding: 3px;
	border-radius: 3px;
}

.hyperlinktext:hover {
	color: #ffffff;
	font-weight: bold;
	overflow-wrap: break-word;
	word-break: break-word;
	background-color: rgb(105, 115, 238);
	padding: 3px;
	border-radius: 3px;
}

.hyperlinktext_selected {
	color: #153381;
	font-weight: bold;
	overflow-wrap: break-word;
	word-break: break-word;
	background-color: rgb(235, 235, 235);
	padding: 3px;
	border-radius: 3px;
}

.grid_listado {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(300px, 100fr));
	grid-gap: var(--grid-gap);
	padding: var(--grid-padding);
	border-radius: var(--border-radius);
	background: #f7f7f7;
}

.grid_listado_pmce {
	display: flow;
	grid-template-columns: repeat(auto-fit, minmax(300px, 100fr));
	grid-gap: var(--grid-gap);
	padding: var(--grid-padding);
	border-radius: var(--border-radius);
	background: #f7f7f7;
}

.grid_listado_main {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(300px, 100fr));
	grid-gap: var(--grid-gap-main);
	padding: var(--grid-padding-main);
	border-radius: var(--border-radius-main);
	background: #f7f7f7;
}

.grid_listado_logos {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(300px, 100fr));
	grid-gap: var(--grid-gap);
	padding: var(--grid-padding);
	border-radius: var(--border-radius);
	background: white;
}

.listado_card {
	
	background-color: white;
	border-radius: var(--border-radius);
	padding: var(--grid-padding);
}

.block_centrado {
	display: block;
	text-align: center;
	margin-block: 10px
}

.link_pmce {
	
	background-color: #fbdcad52;
}

.link_pmce_dimmed {
	
	background-color: #f2e2c952;
}


.link_pmce_inline {
	
	background-color: #fbdcad52;
	padding: 0px 3px;
	border-radius: 3px;
	word-break: break-all;
}

.botones_ordenar_elemento {
    display: flex;
    margin: 2px 2px 2px 2px;
    border-radius: 4px;
    padding: 3px 4px 3px 4px;
    background-color: #ebe1d27a;
}

.botones_ordenar_contenedor {
	display: flex;
	flex-wrap: wrap;
}

.botones_paginar_elemento {
    display: flex;
    margin: 2px 2px 2px 2px;
    border-radius: 4px;
    padding: 3px 4px 3px 4px;
    background-color: #ebe1d27a;
}

.selected {
	background-color: #ee9207cc;
	color: white;
}

.botones_paginar_contenedor {
	display: flex;
	flex-wrap: wrap;
}

.link_pmce_inline_selected {
	
	background-color: #ee9207cc;
	color: white;
	padding: 0px 3px;
	border-radius: 3px;
	word-break: break-all;
}

.ul_pmce {
	margin-top: 2px;
	margin-bottom: -1px;
}

.li_pmce {
	
	margin-bottom: 3px;
	
}

.ul_grantexto {
	margin-top: 2px;
	margin-bottom: -1px;
	margin-left: -30px;
    list-style: none;
}

.li_grantexto {
	
	margin-bottom: 8px;
	
}

.margin10px {
	margin: 400px;
}

.select_separator {
}

.select_pmce_field {
    border-color: cadetblue;
	font-family : var(--font-family-control);
	font-size : var(--font-size-control);
	border-radius: var(--border-radius);
	padding: 2px;
	margin: 2px;
    background-color: white;
    color: black;
}

.editbox_pmce_field {
    font-family: var(--font-family-control);
    font-size: var(--font-size-control);
    border-radius: var(--border-radius);
    padding: 3px 3px 3px 5px;
    margin: 2px;
    background-color: white;
    color: black;
    border-color: cadetblue;
    border: none;
    outline: solid;
    outline-width: 1px;
    outline-color: cadetblue;

}

.select_pmce_field option:checked {
 
	background-color: cadetblue;
	color: white;

}

.select_pmce_field option:hover {
 
    background-color: #e67e22; 
	color: white;

}

.width100px {
	width: 100px;
}

.width150px {
	width: 150px;
}

.width200px {
	width: 200px;
}

.width180px {
	width: 180px;
}

.width250px {
	width: 250px;
}

.width300px {
	width: 300px;
}

.titulogrupo_pmce {
	color: white;
	background-color: cadetblue;
	display: block;
	border-radius: var(--border-radius-link-pmce);
	padding: var(--grid-padding-link-pmce);
	margin: var(--grid-margin-link-pmce);
}

.text_block_pmce {
	
	display: inline-block;
	border-radius: var(--border-radius-link-pmce);
	padding: var(--grid-padding-link-pmce);
	margin: var(--grid-margin-link-pmce);
	word-break: break-word;
}

.listado_card_pmce {
	
	background-color: white;
	border-radius: var(--border-radius-pmce);
	padding: var(--grid-padding-pmce);
	margin: var(--grid-margin-pmce);
	line-height: 1.2;
}

.listado_card_pmce_seleccionado {
	background-color: #fbdcad52;
}

.listado_card_pmce_seleccionado:hover,
.listado_card_pmce_seleccionado:hover * {
	background-color: #e67e22;
	color: white;
}

.listado_card_button_pmce {
	
	background-color: cadetblue;
	color: white;
	border-radius: var(--border-radius-pmce);
	padding: var(--grid-padding-pmce);
	margin: var(--grid-margin-pmce);
	line-height: 1.2;
}

.ficha_card_pmce {
	
	background-color: white;
	border-radius: var(--border-radius-pmce);
	padding: var(--grid-padding-pmce);
	margin: var(--grid-margin-pmce);
}

.listado_card_main {
	
	background-color: #324c5c;
	border-radius: var(--border-radius-main);
	padding: var(--grid-padding-main);
    color: white;
}

@keyframes foundedcolorChange {
	
  0% {
	transform:rotate(9deg);
  }
  5% {
	transform:rotate(-6deg); 
  }
  10% {
	transform:rotate(4deg);
  }
  15% {
    background-color: #e67e22; 
	transform:rotate(-2deg);
  }
  20% {
	transform:rotate(1deg); 
  }
   20% {
	transform:rotate(0deg); 
  }

  80% {
	background-color: #e67e22	;
  }
  100% { 
  }
  
}

.founded {

	animation: foundedcolorChange 1.5s forwards;
}

.tarjeta_texto_titular {
	font-size:2em;
	font-weight: bold;
}

.tarjeta_texto_titulo {
	font-size:1.5em;
	font-weight: bold;
}

.tarjeta_texto_texto {

}

.tarjeta_texto_br {
	line-height:150%;
}

.tarjeta_imagen_full_width {
	width: 100%;
	height: auto;
	max-heigth: 150px;

}

.tarjeta_imagen_credito_logo {
	padding: 10px;
	max-width: 80%;
	max-height: 120px;

}

.grid {
	display:grid;
	justify-content: center;
	grid-column: 1;
	grid-row:1;
}

.gridcenter {
	justify-content: center;
}

.bannertext {
	top: calc(-50px - 18vh);
    position: relative;
	font-size: calc(20px + 1vmax + 1.3vmin);
    font-weight: bold;
    background-color: rgba(0,0,0,0.6);
    text-align: center;
    padding: 8px;
    width: 95%;
    margin: auto;
    color: white;
    border-radius: 5px;
	overflow:hidden;
	cursor: pointer;
	animation-name: fadein;
	animation-duration: 2s;
	animation-timing-function: linear;
	animation-iteration-count: 1;

}

@keyframes fadein {
    0%   {opacity: 0; transform: scale(0.7);}
	50%   {opacity: 0; transform: scale(0.7);}
    100% {opacity: 1; transform: scale(1);}	
}

.imagesovervideo{
	display: inline-block;
	height: calc(5px + 1.4vh + 1.4vw);
	margin: 3px;
	margin-top: 6px;
}

.negrita {
	font-weight: bold;
	font-style: normal;
}

.negritaycursiva {
	font-weight: bold;
	font-style: italic;
}

.normal {
	font-weight: normal;
	font-style: normal;
}

.cursiva {
	font-weight: normal;
	font-style: italic;
}

.negrita_cursiva {
	font-weight: bold;
	font-style: italic;
}

.mapa_estatico {
    padding: 20px;
    width: fit-content;
    margin: auto;
}

.mapa_estatico_img {
	
	max-width: 390px;
    width: 100%;
    border-radius: 10px;
	
}

.introimagesdiv {
	background-color: rgb(0,0,0,0.25);
	width: 100%;
	height: 100%;
	margin: 0 auto;
	overflow: hidden;
	position: relative;
	display: inline-flex;
	border-radius: 5px;
}

.intro_img_show_on {
	opacity: 0;
	display: block;
	width: 100%;
	height: 100%;
	border-radius: 5px;
	cursor: pointer;
}

.animation_kenburns_1 {
	
	animation: kenburns_1 10s forwards;
}

.animation_kenburns_2 {
	animation: kenburns_2 10s forwards;
}

.animation_fading_1 {
	animation: fading 10s forwards;
}

.animation_fading_2 {
	animation: fading 10s forwards;
}

.intro_img_show_off {
	width: 100%;
	margin-left: -100%;
	opacity: 0;
	display: block;
	height: 100%;
	cursor: pointer;
}

.cluster:hover {
	transform: scale(1.2);
}

.carta_presentacion{
	margin: 0px 40px;
	text-align: justify;
	font-size: 1.2em;
}

.carta_criterios{
	margin: 0px 40px;
	text-align: justify;
	font-size: 1.2em;
}

.carta_criterios > ul {
	
}

.carta_criterios > ul > li {
	
}

.carta_creditos{
	margin: 0px 50px;
	text-align: center;
}

.credito_etiqueta {
	text-align: center;
	color: grey;
}

.credito_texto {
	text-align: center;
	font-size: 1.3em;
}

.credito_logo {
	text-align: center;
	font-size: 1.3em;
	vertical-align: center;
}

.credito_logo:hover {
	background-color: rgb(229, 240, 245);
}


.credito_titular {
	text-align: center;
	font-size: 1.6em;
	font-weight: bold;
}

.credito_texto a {
	color: black;
}

.pmce_valor_compartir {
	display: flex;
	align-items: center;
	width: 100%;
	gap: 6px;
}

.pmce_valor_compartir_texto {
	flex: 1 1 auto;
	min-width: 0;
	word-break: break-word;
}

.pmce_boton_compartir {
	flex: 0 0 auto;
	margin-left: auto;
	border: none;
	border-radius: var(--border-radius-link-pmce);
	padding: 5px 7px;
	background-color: #719ea1;
	color: white;
	cursor: pointer;
	line-height: 1;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.pmce_boton_compartir:hover {
	background-color: #e67e22;
	color: white;
}

.pmce_boton_compartir_svg {
	width: 16px;
	height: 16px;
	display: block;
}

.pmce_boton_compartir_svg circle {
	fill: currentColor;
}

.pmce_boton_compartir_svg line {
	stroke: currentColor;
	stroke-width: 2.4;
	stroke-linecap: round;
}

.pmce_share_panel {
	position: fixed;
	display: none;
	min-width: 360px;
	max-width: 680px;
	z-index: 999999;
	background: white;
	border-radius: var(--border-radius-pmce);
	box-shadow: 0 8px 25px rgba(0,0,0,.25);
	padding: 16px;
	font-size: 0.95em;
}

.pmce_share_panel_triangulo {
	position: absolute;
	top: -10px;
	right: 10px;
	width: 0;
	height: 0;
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
	border-bottom: 10px solid white;
}

.pmce_share_panel_cerrar {
	position: absolute;
	top: 5px;
	right: 7px;
	border: none;
	background: transparent;
	font-size: 1.3em;
	cursor: pointer;
	color: #5f5f5f;
}

.pmce_share_panel_titulo {
	font-weight: bold;
	margin-bottom: 10px;
	padding-right: 24px;
}

.pmce_share_panel_url {
	word-break: break-all;
	background: #f7f7f7;
	padding: 10px;
	border-radius: var(--border-radius-link-pmce);
	font-family: Consolas, monospace;
	margin-bottom: 12px;
}

.pmce_share_panel_estado {
	margin-top: 10px;
	font-weight: bold;
	color: #2e7d32;
}

.pmce_share_panel_botones {
	text-align: right;
}

.pmce_score_discreto_bloque {
	display: var(--pmce-score);
	margin-top: 3px;
	line-height: 1;
}

.pmce_score_discreto {
	display: block;
    font-size: 0.75em;
    color: #dcdbdb;
    letter-spacing: 0.01em;
    text-align: left;
    font-weight: bold;
	height: 3px;
}

@keyframes kenburns_1 {
	0% {
		opacity: 0;
		
		-webkit-transform-origin: 35% 65%;
		-moz-transform-origin: 35% 65%;
		-ms-transform-origin: 35% 65%;
		-o-transform-origin: 35% 65%;
		transform-origin: 35% 65%;
		
		transform: scale(1.0);
		-ms-transform: scale(1.0);
		-webkit-transform: scale(1.0);
		-o-transform: scale(1.0);
		-moz-transform: scale(1.0);
		
		filter: blur(3px);

	}
	  
	15% {
		filter: none;
		opacity: 1;
	}
	
	85% {
		
		transform: scale3d(1.5,1.5,1.5);
		-ms-transform: scale3d(1.5);	
		-webkit-transform: scale3d(1.5,1.5,1.5);
		-o-transform: scale3d(1.5,1.5,1.5);
		-moz-transform: scale3d(1.5,1.5,1.5);
		
		filter: none;
		opacity: 1;
		
	  }
	  
	100% {

		transform: scale3d(1.5,1.5,1.5);
		-ms-transform: scale3d(1.5);	
		-webkit-transform: scale3d(1.5,1.5,1.5);
		-o-transform: scale3d(1.5,1.5,1.5);
		-moz-transform: scale3d(1.5,1.5,1.5);
		
		filter: blur(3px);
		opacity: 0;
		
	  }
}

@keyframes fading {
	
	0% {
		opacity: 0;
						
		filter: blur(3px);

	}
	  
	15% {
		filter: none;
		opacity: 1;
	}
	
	85% {
				
		filter: none;
		opacity: 1;
		
	 }
	  
	100% {
		
		filter: blur(3px);
		opacity: 0;
		
	 }
}


@keyframes kenburns_2 {
	0% {
		opacity: 0;
		
		-webkit-transform-origin: 35% 65%;
		-moz-transform-origin: 35% 65%;
		-ms-transform-origin: 35% 65%;
		-o-transform-origin: 35% 65%;
		transform-origin: 35% 65%;
		
		transform: scale(1.5);
		-ms-transform: scale(1.5);
		-webkit-transform: scale(1.5);
		-o-transform: scale(1.5);
		-moz-transform: scale(1.5);
		filter: blur(3px);
	}
	  
	15% {
		filter: none;
		opacity: 1;
	}
	
	85% {
		
		transform: scale3d(1,1,1);
		-ms-transform: scale3d(1,1,1);	
		-webkit-transform: scale3d(1,1,1);
		-o-transform: scale3d(1,1,1);
		-moz-transform: scale3d(1,1,1);
		
		filter: none;
		opacity: 1;
		
	  }
	  
	100% {

		transform: scale3d(1,1,1);
		-ms-transform: scale3d(1,1,1);	
		-webkit-transform: scale3d(1,1,1);
		-o-transform: scale3d(1,1,1);
		-moz-transform: scale3d(1,1,1);
		filter: blur(3px);
		opacity: 0;
	  }
}

.logo-pmce { height: 7vh; }

/* Tarjeta Entidades: descripción en 1 línea, completa al pasar el cursor */
.listado_card_main[onclick*="idcoleccionentidades"] > span {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 1;
	line-clamp: 1;
	overflow: hidden;
}
.listado_card_main[onclick*="idcoleccionentidades"]:hover {
	position: relative;
	z-index: 5;
	margin-bottom: -2.6em;
}
.listado_card_main[onclick*="idcoleccionentidades"]:hover > span {
	-webkit-line-clamp: unset;
	line-clamp: unset;
	overflow: visible;
}

@media print {
	
	.no-print {
		display: none;
	}
	
	.grid_A, .control_button, .grid_wraper_cabecera {
		  display: none;
	  }	 
	  
	.grid_tarjeta_cabecera {
		height: auto;
	}
	  
	.grid_ventana_centrada {
		position: absolute;
		background-color: white;
		height: 800px;
		top: 30px;
	}
	
	.grid_tarjeta{
		display: grid;
		grid-template-rows: minmax(auto, 60px) auto 30px;
		height: auto;
	}
	
	.grid_tarjeta_cuerpo {
		background-color: var(--paneles_color);
		border-radius: var(--border-radius);
		padding: var(--grid-padding);
		overflow-x: hidden;
		overflow-y: hidden;
		height: auto;
	}
	
	.tarjeta {
		opacity: 1;
		display: block;
		width: 90vw;
		height: auto;
		max-width: 800px;
		background-color: white;
		border-radius: 5px;
		padding: 5px;
	}
	
	.tarjeta_ficha {
		opacity: 1;
		display: block;
		width: 90vw;
		height: auto;
		max-width: 800px;
		background-color: white;
		border-radius: 5px;
		padding: 5px;
	}
	
	@page {
		size: A4 vertical; /* Configuración de tamaño y orientación */
		margin: 0mm;
	}
	
	
	
	* {
		-webkit-print-color-adjust: exact; /* Para asegurarse de que los fondos se impriman en WebKit-based browsers */
		print-color-adjust: exact; /* Para navegadores modernos */
	}
}

@media (max-width: 414px) {	

	video {
		margin-left: -200px;
	}
	
	.introimages {
		margin-left: -200px;
	}
	
	.introimagesdiv img {
		margin-bottom: 23vh;
	}
	
	.intro_img_show_on {
		opacity: 0;
		display: block;
		width: 100%;
		height: 100%;
		border-top-left-radius: 5px;
		border-top-right-radius: 5px;
	}
	
	.bannertext {
		top: calc(-80px - 10vh)
	}
	
	.control_editbuscar {
		width: 100px;
	}
	
	.grid_A {
		display: grid;
		grid-template-columns: 100%;
		grid-template-rows: 2fr 96fr 2fr;
		width: 100vw;
		height: 92vh;
		grid-gap: var(--grid-gap);
		padding: var(--grid-padding);
		border-radius: var(--border-radius);
	}
	
	.nodo_etiqueta {
		font-size: 0.8em;
	}
	
}

@media (max-width: 768px) {	

	.control_editbuscar {
		width: 250px;
	}

	.tarjeta_ficha {
		opacity: 0.98;
		display: block;
		width: 90vw;
		height: 80vh;
		max-width: 900px;
		background-color: white;
		border-radius: 5px;
		padding: 5px;
		margin: auto;
		overflow: hidden;
	}
	
	.fondo_imagen_portal::before{

		background: center;

	}
	
	.increasefontbuttonbar {
		font-size: 1.0em;
	}

}

@media (max-height: 414px) {	

	.bannertext {
		top: calc(-70px - 12vh - 12vw);
	}
	
	.increasefontbuttonbar {
		font-size: 1.0em;
	}
	
}

/* ===== Intro PMCE: cartela grande que se divide en logo + PMCE (solo CSS) =====
   Las fotos cambian cada 10 s; la cartela sigue un ciclo de 47 s que no
   coincide con el de las fotos, así que la cartela grande cae cada vez
   sobre una foto distinta y todas las caras quedan despejadas en algún momento.
   En la versión pequeña: logo abajo a la izquierda y "PMCE" abajo a la derecha.

   Entrada: la cartela grande aparece una sola vez (1,5 s).
   Ciclo (47 s, empieza y termina igual, sin saltos):
     0-19 %   grande                       (~9 s)
    19-26 %   se encoge y se abre: logo y PMCE salen del centro hacia las esquinas
    26-86 %   versión pequeña              (~28 s)
    86-93 %   logo y PMCE vuelven al centro y reaparece la cartela grande
    93-100 %  grande y enlaza con el siguiente ciclo                              */

#idintrofullscreen .fullscreencuerpo { position: relative; }

/* --- Cartela grande --- */
#idintrofullscreen .bannertext {
	position: absolute;
	top: auto;
	left: 50%;
	bottom: 6%;
	width: 90%;
	box-sizing: border-box;
	transform: translateX(-50%);
	z-index: 3;
	animation: pmce_entrada 1.5s ease-out 0s 1,
	           pmce_cartela 47s ease-in-out 1.5s infinite;
}

/* Entrada: solo la primera vez */
@keyframes pmce_entrada {
	from { opacity: 0; transform: translateX(-50%) scale(0.92); filter: blur(4px); }
	to   { opacity: 1; transform: translateX(-50%) scale(1);    filter: blur(0); }
}

/* Ciclo: 0 % y 100 % son idénticos, así no hay parpadeo al repetir */
@keyframes pmce_cartela {
	0%, 19%   { opacity: 1; visibility: visible; transform: translateX(-50%) scale(1);    filter: blur(0); }
	25%, 87%  { opacity: 0; visibility: hidden;  transform: translateX(-50%) scale(0.55); filter: blur(6px); }
	93%, 100% { opacity: 1; visibility: visible; transform: translateX(-50%) scale(1);    filter: blur(0); }
}

/* --- Versión pequeña: logo (izquierda) y PMCE (derecha) --- */
#idintrofullscreen .fullscreencuerpo::before,
#idintrofullscreen .fullscreencuerpo::after {
	position: absolute;
	bottom: 4%;
	z-index: 3;
	height: calc(14px + 1.3vw);
	box-sizing: border-box;
	border-radius: 5px;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.35);
	opacity: 0;
	pointer-events: none;
}

/* Logo */
#idintrofullscreen .fullscreencuerpo::before {
	content: "";
	left: 3%;
	border-radius: 0px;
	aspect-ratio: 1323 / 172;
	background: #fff url("images/idiomas/musica/base/logo-pmce.png") center / contain no-repeat;
	animation: pmce_mini_logo 47s ease-in-out 1.5s infinite;
}

/* PMCE */
#idintrofullscreen .fullscreencuerpo::after {
	content: "PMCE";
	right: 3%;
	padding: 0 0.7em;
	line-height: calc(14px + 1.3vw);
	font-size: calc(12px + 0.7vw);
	font-weight: bold;
	letter-spacing: 0.08em;
	color: #fff;
	background-color: rgba(0, 0, 0, 0.55);
	animation: pmce_mini_texto 47s ease-in-out 1.5s infinite;
}

@keyframes pmce_mini_logo {
	0%, 20%   { opacity: 0; left: 38%; transform: scale(0.8); }
	26%, 86%  { opacity: 1; left: 3%;  transform: scale(1); }
	92%, 100% { opacity: 0; left: 38%; transform: scale(0.8); }
}
@keyframes pmce_mini_texto {
	0%, 20%   { opacity: 0; right: 38%; transform: scale(0.8); }
	26%, 86%  { opacity: 1; right: 3%;  transform: scale(1); }
	92%, 100% { opacity: 0; right: 38%; transform: scale(0.8); }
}

/* --- Móvil en vertical: la cartela va debajo de la foto, fija y en grande --- */
@media (orientation: portrait) and (max-width: 600px) {
	#idintrofullscreen .fullscreen { height: 93vh; height: 93dvh; }
	#idintrofullscreen .introimagesdiv { height: auto; aspect-ratio: 16 / 9; }
	#idintrofullscreen .introimagesdiv img { margin-bottom: 0; }
	#idintrofullscreen .bannertext {
		position: static;
		transform: none;
		width: 95%;
		margin: 12px auto 0;
		animation: fadein 2s linear 0s 1;
	}
	#idintrofullscreen .fullscreencuerpo::before,
	#idintrofullscreen .fullscreencuerpo::after { display: none; }
}

/* PMCE: vínculos con botón dentro de botón.
   La línea entera busca todo el vínculo; el grupo (nombre/s + rol) busca ese grupo;
   cada nombre y cada rol, por separado, buscan solo ese dato. */
.pmce_vinculo_boton {
	display: inline-block;
	line-height: 1.25;
	padding: 1px 6px;
	margin: 1px 1px;
	background-color: rgba(255, 255, 255, 0.55);
	border: none;
	border-radius: 3px;
	box-shadow: none;
	cursor: pointer;
}
.pmce_vinculo_bloque {
	white-space: nowrap;
}
.pmce_vinculo_grupo {
	display: inline-block;
	padding: 3px 4px;
	margin: 2px 0;
	background-color: #f8e0c0;
	border-radius: 3px;
	box-shadow: none;
	cursor: pointer;
}
.hover_naranja:hover .pmce_vinculo_boton {
	background-color: rgba(255, 255, 255, 0.16);
	color: #ffffff;
}
.hover_naranja:hover .pmce_vinculo_grupo {
	background-color: rgba(255, 255, 255, 0.14);
}
.pmce_vinculo_grupo:hover,
.hover_naranja:hover .pmce_vinculo_grupo:hover {
	background-color: #c0600f;
	color: white;
}
.pmce_vinculo_boton:hover,
.hover_naranja:hover .pmce_vinculo_boton:hover,
.hover_naranja:hover .pmce_vinculo_grupo:hover .pmce_vinculo_boton:hover {
	background-color: #7a3605;
	border-color: #7a3605;
	color: white;
}

/* PMCE: al imprimir, los vínculos salen como texto normal (sin colores, marcos ni sombras) */
@media print {
	.link_pmce,
	.hover_naranja,
	.pmce_vinculo_grupo,
	.pmce_vinculo_boton {
		background: none !important;
		background-color: transparent !important;
		border: none !important;
		box-shadow: none !important;
		color: #000000 !important;
		padding: 0 !important;
		margin: 0 !important;
	}
	.pmce_vinculo_bloque {
		white-space: normal;
	}
}
