/* estilos comunes */
@font-face {
	font-family: 'SyneMono';	
	src: url('https://paranoia.alaluz.cl/assets/font/SyneMono-Regular.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}

/***** grl **/

:root {
	--primary: #227093;
	--secondary: #ff5252;
	--background: #eee;
	--highlight: #ffda79;
	/* Theme color */
	--theme: var(--primary);
}


* {
	margin: 0;
	padding: 0;
}

body {
	min-width: 100vw;
	font-family: 'SyneMono';
  overflow-x: hidden;
	/*background-color: #000000;*/
}

footer {
	background-color: #000000;
	margin: 0;
	padding: 0;
}

footer div {
	color: white;
	;
	display: flex;
	flex-direction: column;
	align-items: center;
	flex-wrap: nowrap;
}

footer div img,
footer div p {
	margin: 1rem 0 0.2rem 0;
}

footer div a {
	color: white;
}

footer div a:hover {
	color: yellow;
}

.alignleft {
	float: left;
	margin: 0 10px 10px 0;
}

.alignright {
	float: right;
	margin: 0 0 10px 10px;
}

li {
	margin-bottom: 2rem;
}

.mobile-only {
	display: block;
}

.desktop-only {
	display: none;
}

/* menu de navegacion */

#menu {
	background: #000000;
	height: 45px;
	border-radius: 0px;
}

#menu ul,
#menu li {
	margin: 0 auto;
	padding: 0;
	list-style: none
}

#menu ul {
	width: 100%;
	text-align: center;
}

#menu li {
	display: inline-block;
	position: relative;
}

#menu a {
	display: block;
	line-height: 45px;
	padding: 0 14px;
	text-decoration: none;
	color: #FFFFFF;
	font-size: 16px;
}

#menu a.dropdown-arrow:after {
	content: "\25BE";
	margin-left: 5px;
}

#menu li a:hover {
	color: #FFD308;
	background: #000000;
}

#menu input {
	display: none;
	margin: 0;
	padding: 0;
	height: 45px;
	width: 100%;
	opacity: 0;
	cursor: pointer
}

#menu label {
	display: none;
	line-height: 45px;
	text-align: center;
	position: absolute;
	left: 35px
}

#menu label:before {
	font-size: 1.6em;
	color: #FFFFFF;
	content: "\2261";
	margin-left: 20px;
}

#menu ul.sub-menus {
	height: auto;
	overflow: hidden;
	width: 170px;
	background: #444444;
	position: absolute;
	z-index: 99;
	display: none;
}

#menu ul.sub-menus li {
	display: block;
	text-align: left;
	width: 100%;
}

#menu ul.sub-menus a {
	color: #FFFFFF;
	font-size: 16px;
}

#menu li:hover ul.sub-menus {
	display: block
}

#menu ul.sub-menus a:hover {
	background: #F2F2F2;
	color: #444444;
}

/* personalización */
.ojo-avisor {
	position: relative;
	background-image: url('https://paranoia.alaluz.cl/assets/img/camara5.webp');
	/* Replace with your image URL */
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	height: 60vh;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	align-items: flex-end;
	color: yellow;
}

.ojo-avisor h1 {
	font-size: 3em;
	font-weight: 700;
	margin: 0 2rem;
	background-color: rgba(0, 0, 0, 0.8);
}

.ojo-avisor p {
	font-size: 2em;
	margin: 0 0 2rem 2rem;
	background-color: rgba(0, 0, 0, 0.8);
}

.item.item-1,
.item.item-2,
.item.item-3,
.item.item-5,
.item.item-b0,
.item.item-b1,
.item.item-b2,
.item.item-b3,
.item.item-b4,
.item.item-b5,
.item.item-b6,
.item.item-b7,
.item.item-b8,
.item.item-b9,
.item.item-b10,
.item.item-b11,
.item.item-b12,
.item.item-b13,
.item.item-b14,
.item.item-b15,
.item.item-b16,
.item.item-b17,
.item.item-b18,
.item.item-b19,
.item.item-b20,
.item.item-b21,
.item.item-b22,
.item.item-b23,
.item.item-c0, 
.item.item-c1, 
.item.item-c2, 
.item.item-c3 {
	height: auto;
	padding: 0;
	margin: 0;
	background-color: rgba(0, 0, 0, 0.544);
	border-radius: 10px;
}

.item.item-1 article,
.item.item-2 article,
.item.item-3 article,
.item.item-5 article,
.item.item-b0 article,
.item.item-b1 article,
.item.item-b2 article,
.item.item-b3 article,
.item.item-b4 article,
.item.item-b5 article,
.item.item-b6 article,
.item.item-b7 article,
.item.item-b8 article,
.item.item-b9 article,
.item.item-b10 article,
.item.item-b11 article,
.item.item-b12 article,
.item.item-b13 article,
.item.item-b14 article,
.item.item-b15 article,
.item.item-b16 article,
.item.item-b17 article,
.item.item-b18 article,
.item.item-b19 article,
.item.item-b20 article,
.item.item-b21 article,
.item.item-b22 article,
.item.item-b23 article,
.item.item-c0 article, 
.item.item-c1 article, 
.item.item-c2 article, 
.item.item-c3 article {
	height: auto;
	padding: 0;
	margin: 0;
}

.seccion-contenidos-imagen {
	margin: 0;
	padding: 0;
	height: 200px;
	background-size: cover;
	background-repeat: no-repeat;
	border-radius: 10px;
}

.item.item-1 .seccion-contenidos-imagen {
	background-image: url('https://paranoia.alaluz.cl/assets/img/personas-juego-rol2.webp');
	background-position: center;
}

.item.item-2 .seccion-contenidos-imagen {
	background-image: url('https://paranoia.alaluz.cl/assets/img/esclarecedor2.webp');
	background-position: center;
}

.item.item-3 .seccion-contenidos-imagen {
	background-image: url('https://paranoia.alaluz.cl/assets/img/jugador.webp');
	background-position: center;
}

.item.item-b1 .seccion-contenidos-imagen {
	background-image: url('https://paranoia.alaluz.cl/assets/img/cs-2.webp');
	background-position: center;
}

.item.item-b2 .seccion-contenidos-imagen {
	background-image: url('https://paranoia.alaluz.cl/assets/img/esclarecedor3.webp');
	background-position: center;
}

.item.item-b3 .seccion-contenidos-imagen {
	background-image: url('https://paranoia.alaluz.cl/assets/img/servicios.webp');
	background-position: center;
}

.item.item-b5 .seccion-contenidos-imagen {
	background-image: url('https://paranoia.alaluz.cl/assets/img/traidores.webp');
	background-position: center;
}

.item.item-b6 .seccion-contenidos-imagen {
	background-image: url('https://paranoia.alaluz.cl/assets/img/sociedades-secretas.webp');
	background-position: center;
}

.item.item-b7 .seccion-contenidos-imagen {
	background-image: url('https://paranoia.alaluz.cl/assets/img/mutantes.webp');
	background-position: center;
}

.item.item-b11 .seccion-contenidos-imagen {
	background-image: url('https://paranoia.alaluz.cl/assets/img/libro-reglas2.webp');

}

.item.item-b12 .seccion-contenidos-imagen {
	background-image: url('https://paranoia.alaluz.cl/assets/img/windows-xp.webp');
}

.item.item-b13 .seccion-contenidos-imagen {
	background-image: url('https://paranoia.alaluz.cl/assets/img/aventureras.webp');
}

.item.item-b14 .seccion-contenidos-imagen {
	background-image: url('https://paranoia.alaluz.cl/assets/img/burocracia.webp');
}

.item.item-b15 .seccion-contenidos-imagen {
	background-image: url('https://paranoia.alaluz.cl/assets/img/descargas2.webp');
}

.item.item-b17 .seccion-contenidos-imagen {
	background-image: url('https://paranoia.alaluz.cl/assets/img/castigos.webp');
}

.item.item-b19 .seccion-contenidos-imagen {
	background-image: url('https://paranoia.alaluz.cl/assets/img/cantante.webp');
}

.item.item-b21 .seccion-contenidos-imagen {
	background-image: url('https://paranoia.alaluz.cl/assets/img/dados-robot.webp');
	background-position: 50% 30%;
}

.item.item-b22 .seccion-contenidos-imagen {
	background-image: url('https://paranoia.alaluz.cl/assets/img/logs.webp');
}

.item.item-b23 .seccion-contenidos-imagen {
	background-image: url('https://paranoia.alaluz.cl/assets/img/aventurero-solitario.webp');
	background-position: 50% 30%;
}

.item-c0 .seccion-contenidos-imagen {
	background-image: url('https://paranoia.alaluz.cl/assets/img/dados-robot.webp');
	background-position: 50% 30%;
}

.item-c1 .seccion-contenidos-imagen {
	background-image: url('https://paranoia.alaluz.cl/assets/img/logs.webp');
}

.item-c2 .seccion-contenidos-imagen {
	background-image: url('https://paranoia.alaluz.cl/assets/img/aventurero-solitario.webp');
	background-position: 50% 60%;
}

.item.item-5,
.item.item-b0,
.item.item-b4,
.item.item-b8,
.item.item-b9 {
	position: relative;
	width: 100%;
	background-size: cover;
	/* Ajusta la imagen para cubrir el área */
	background-position: center;
	/* Centra la imagen */
	background-repeat: no-repeat;
	/* Evita repeticiones */
	display: flex;
	align-items: flex-end;
}

.item.item-5 {
	background-image: url('https://paranoia.alaluz.cl/assets/img/libro-reglas.webp');
}

.item.item-b0 {
	background-image: url('https://paranoia.alaluz.cl/assets/img/la-utopia.webp');
	height: 60vh;
}

.item.item-b4 {
	background-image: url('https://paranoia.alaluz.cl/assets/img/jugando-rol.webp');
}

.item.item-b8 {
	background-image: url('https://paranoia.alaluz.cl/assets/img/consejos.webp');
}

.item.item-b9 {
	background-image: url('https://paranoia.alaluz.cl/assets/img/utravioleta-programador.webp');
}

.item.item-b16 {
	background-image: url('https://paranoia.alaluz.cl/assets/img/hoja-personajes2.webp');
	background-size: cover;
	background-position: 50% 20%;
	display: flex;
	align-items: flex-end;
	color: white;
}

.item.item-b18 {
	background-image: url('https://paranoia.alaluz.cl/assets/img/hoja-personajes.webp');
	background-size: cover;
	background-position: 50% 20%;
	display: flex;
	align-items: flex-end;
	color: white;
}


.item.item-b20 {
	background-image: url('https://paranoia.alaluz.cl/assets/img/gringo.webp');
	background-size: cover;
	background-position: 50% 20%;
	display: flex;
	align-items: flex-end;
	color: white;
}




.queesrol,
.queesparanoia,
.comosejuega,
.lautopia,
.laacreditacion,
.losesclarecedores,
.losservicios,
.lostraidores,
.sociedadessecretas,
.poderesmutantes,
.consejostraidores,
.aventuras,
.divInt1.burocracia,
.hojaspersonaje,
.divInt1.castigos,
.descargasvarias,
.cancioneroparanoico,
.logs,
.aventurassolitario,
.faq {
	background-size: cover;
	display: flex;
	align-items: flex-end;
	color: white;
	width: 100vw;
}

.queesrol {
	background-image: url('https://paranoia.alaluz.cl/assets/img/personas-juego-rol2.webp');
	background-position: 50% 65%;
}

.divInt1.queesparanoia {
	background-image: url('https://paranoia.alaluz.cl/assets/img/esclarecedor2.webp');
	background-position: 50% 30%;
}

.comosejuega {
	background-image: url('https://paranoia.alaluz.cl/assets/img/jugador.webp');
	background-position: 50% 25%;
}

.lautopia {
	background-image: url('https://paranoia.alaluz.cl/assets/img/la-utopia.webp');
	background-position: 50% 40%;
}

.laacreditacion {
	background-image: url('https://paranoia.alaluz.cl/assets/img/cs-1.webp');
	background-position: 50% 5%;
}

.faq {
	background-image: url('https://paranoia.alaluz.cl/assets/img/faq.webp');
	background-position: 50% 40%;
}

.losesclarecedores {
	background-image: url('https://paranoia.alaluz.cl/assets/img/esclarecedor3.webp');
	background-position: 50% 20%;
}

.losservicios {
	background-image: url('https://paranoia.alaluz.cl/assets/img/servicios.webp');
	background-position: 50% 20%;
}

.lostraidores {
	background-image: url('https://paranoia.alaluz.cl/assets/img/traidores.webp');
	background-position: 50% 20%;
}

.sociedadessecretas {
	background-image: url('https://paranoia.alaluz.cl/assets/img/sociedades-secretas.webp');
	background-position: 50% 26%;
}

.poderesmutantes {
	background-image: url('https://paranoia.alaluz.cl/assets/img/mutantes.webp');
	background-position: 50% 7%;
}

.consejostraidores {
	background-image: url('https://paranoia.alaluz.cl/assets/img/consejos.webp');
	background-position: 50% 60%;
}

.aventuras {
	background-image: url('https://paranoia.alaluz.cl/assets/img/aventureras.webp');
	background-position: 50% 60%;
}

.divInt1.burocracia {
	background-image: url('https://paranoia.alaluz.cl/assets/img/burocracia.webp');
	background-position: 50% 40%;
}

.hojaspersonaje {
	background-image: url('https://paranoia.alaluz.cl/assets/img/hoja-personajes2.webp');
	background-position: 50% 40%;
}

.divInt1.castigos {
	background-image: url('https://paranoia.alaluz.cl/assets/img/castigos.webp');
	background-position: 50% 40%;
}

.descargasvarias {
	background-image: url('https://paranoia.alaluz.cl/assets/img/descargas2.webp');
	background-position: 50% 40%;
}

.cancioneroparanoico {
	background-image: url('https://paranoia.alaluz.cl/assets/img/cantante.webp');
	background-position: 50% 20%;
}

.logs {
	background-image: url('https://paranoia.alaluz.cl/assets/img/logs.webp');
	background-position: 50% 20%;
}

.aventurassolitario {
	background-image: url('https://paranoia.alaluz.cl/assets/img/aventurero-solitario.webp');
	background-position: 50% 30%;
}


.item-5 .seccion-contenidos-texto,
.item.item-b0 .seccion-contenidos-texto,
.item.item-b8 .seccion-contenidos-texto,
.item.item-b16 .seccion-contenidos-texto,
.item.item-b18 .seccion-contenidos-texto,
.item.item-b20 .seccion-contenidos-texto {
	background-color: rgba(0, 0, 0, 0.8);
	padding: 15px;
	margin: 0;
}



.item-b10 {
	display: flex;
	flex-direction: column;
	flex-wrap: nowrap;
	justify-content: center;
	align-items: center;
	background-color: #be03fc !important;
	color: white;
}

.item-b11,
.item-b12,
.item-b13,
.item-b14,
.item-b15,
.item-b16,
.item-b17,
.item-b18,
.item-b19,
.item-b20,
.item-b21,
.item-b22,
.item-b23 {
	background-color: #be03fc !important;
	color: white;
}

.item.item-4 {
	/*
	position: relative;
	background-image: url('https://paranoia.alaluz.cl/assets/img/esclarecedor6.webp');
	background-size: cover;
	background-position: 50% 20%;
	background-repeat: no-repeat;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	align-items: flex-start;
	border-radius: 10px;
	*/
}


.seccion-contenidos-texto {
	margin: 1rem 10px 0 10px;
	font-size: 1em;
}

.link-titulo-seccion {
	color: yellow;
}

.link-titulo-seccion-uv {
	color: lightblue;
}

.link-titulo-seccion:hover,
.link-titulo-seccion-uv:hover {
	color: white;
}


/* generador masivo */

.container-hp-masivo {
	display: flex;
	width: 90vw;
	column-gap: 2rem;
	justify-content: space-evenly;
	margin: 1rem auto;
	padding-top: 1rem;
	border-bottom: 1px solid black;
}

.datos-personaje {
	margin: 2rem;
}

section.imagen {
	text-align: center;
}

section.capacidades {
	margin-top: 1rem;
	text-align: center;
}

section.atributos table,
section.habilidades table {
	margin-top: 2rem;
}

.btn {
	display: inline-block;
	padding: 0.8rem 1.5rem;
	font-size: 1rem;
	color: white;
	background-color: #ff5733;
	border: none;
	border-radius: 5px;
	text-decoration: none;
	transition: background-color 0.3s ease-in-out;
}

.botongeneradormasivo {
	text-align: center;
	margin: 2rem auto;
}

.btn-verde {
	background-color: green;
}

.tab {
	position: relative;
}

.tab input {
	position: absolute;
	opacity: 0;
	z-index: -1;
}

.tab__content {
	max-height: 0;
	overflow: hidden;
	transition: all 0.35s;
}

.tab input:checked~.tab__content {
	max-height: 100%;
}

/* Visual styles */
.accordion {
	color: var(--theme);
	border: 2px solid;
	border-radius: 0.5rem;
	overflow: hidden;
}

.tab__label,
.tab__close {
	display: flex;
	color: white;
	background: var(--theme);
	cursor: pointer;
}

.tab__label {
	justify-content: space-between;
	padding: 1rem;
}

.tab__label::after {
	content: "\276F";
	width: 1em;
	height: 1em;
	text-align: center;
	transform: rotate(90deg);
	transition: all 0.35s;
}

.tab input:checked+.tab__label::after {
	transform: rotate(270deg);
}

.tab__content p {
	margin: 0;
	padding: 1rem;
}

.tab__close {
	justify-content: flex-end;
	padding: 0.5rem 1rem;
	font-size: 0.75rem;
}

.accordion--radio {
	--theme: var(--secondary);
}

/* Arrow animation */
.tab input:not(:checked)+.tab__label:hover::after {
	animation: bounce .5s infinite;
}

@keyframes bounce {
	25% {
		transform: rotate(90deg) translate(.25rem);
	}

	75% {
		transform: rotate(90deg) translate(-.25rem);
	}
}


/* Media Query for Mobile Devices */
@media (max-width: 480px) {

	.seccion-contenidos-texto {
		color: white;
	}
	.grid, .gridb {
		display: flex;
		flex-direction: column;
		align-items: stretch;
		flex-wrap: nowrap;
		row-gap: 0.2rem;
	  }
	
	  .item.item-5, .item.item-b0, .item.item-b8, .item.item-b9  {
		height: 40vh;
		/*width: 100vw;*/
		margin-bottom: 0.2rem;;
	  }
	
	  .item-5 .seccion-contenidos-texto, .item.item-b0 .seccion-contenidos-texto,
	  .item-b8 .seccion-contenidos-texto {
		/*width: 100vw;*/
		color: white;
	  }
	
	  .item.item-5 article {
		width: 100vw;
	}
	
	  .seccion-contenidos-text {
		margin:0;
		padding: 1.2rem 0!important;
	  }

	  .divInt2 {
		padding:1rem;
	  }

	  .divInt2 p {
		margin: 2rem 0;
	  }

	  #menu {position:relative}
	  #menu ul {background:#444444;position:absolute;top:100%;right:0;left:0;z-index:3;height:auto;display:none;text-align:left;}
	  #menu ul.sub-menus {width:100%;position:static;}
	  #menu ul.sub-menus a {padding-left:30px;}
	  #menu li {display:block;float:none;width:auto;}
	  #menu input, #menu label {position:absolute;top:0;left:0;display:block}
	  #menu input {z-index:4}
	  #menu input:checked + label {color:#FFFFFF}
	  #menu input:checked + label:before {content:"\00d7"}
	  #menu input:checked ~ ul {display:block}
}

/* Media Query for low resolution  Tablets, Ipads */
@media (min-width: 481px) and (max-width: 767px) {
	main {
		width: 100vw;;
	}

	#menu {
		position: relative
	}

	#menu ul {
		background: #444444;
		position: absolute;
		top: 100%;
		right: 0;
		left: 0;
		z-index: 3;
		height: auto;
		display: none;
		text-align: left;
	}

	#menu ul.sub-menus {
		width: 100%;
		position: static;
	}

	#menu ul.sub-menus a {
		padding-left: 30px;
	}

	#menu li {
		display: block;
		float: none;
		width: auto;
	}

	#menu input,
	#menu label {
		position: absolute;
		top: 0;
		left: 0;
		display: block
	}

	#menu input {
		z-index: 4
	}

	#menu input:checked+label {
		color: #FFFFFF
	}

	#menu input:checked+label:before {
		content: "\00d7"
	}

	#menu input:checked~ul {
		display: block
	}

  .grid, .gridb {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    flex-wrap: nowrap;
    row-gap: 0.2rem;
  }

  .item.item-5, .item.item-b0, .item.item-b8, .item.item-b9  {
    height: 40vh;
    /*width: 100vw;*/
    margin-bottom: 0.2rem;;
  }

  .item-5 .seccion-contenidos-texto, .item.item-b0 .seccion-contenidos-texto,
  .item-b8 .seccion-contenidos-texto {
    /*width: 100vw;*/
    color: white;
  }

  .item.item-5 article {
    width: 100vw;
}

  .seccion-contenidos-text {
    margin:0;
    padding: 1.2rem 0!important;
  }

  #menu {position:relative}
  #menu ul {background:#444444;position:absolute;top:100%;right:0;left:0;z-index:3;height:auto;display:none;text-align:left;}
  #menu ul.sub-menus {width:100%;position:static;}
  #menu ul.sub-menus a {padding-left:30px;}
  #menu li {display:block;float:none;width:auto;}
  #menu input, #menu label {position:absolute;top:0;left:0;display:block}
  #menu input {z-index:4}
  #menu input:checked + label {color:#FFFFFF}
  #menu input:checked + label:before {content:"\00d7"}
  #menu input:checked ~ ul {display:block}

}

/* Media Query for Tablets Ipads portrait mode */
@media (min-width: 768px) and (max-width: 1023px) {
	main {
    width: 100vw;
  }
  .ojo-avisor {
    height: 53vh!important;
  }
  .item.item-b0 {    
    height: 46vh!important;
  }
  .item.item-b16 {
    height: 46vh!important;
  }

  .grillaInterior {
	display: flex;
	width: 100vw;
	column-gap: 2rem;
	}

	.divInt2 {
		width: 60vw!important;
		padding:1rem;
	}

	.divInt3 {
		width: 40vw!important;
	}
}

/* Media Query for Laptops and Desktops */
@media (min-width: 1024px) and (max-width: 1279px) {
	main {
    width: 100vw;
  }

  .ojo-avisor {
    height: 35vh!important;
  }
  .item.item-b0 {    
    height: 31vh!important;
  }
  .item.item-b16 {
    height: 31vh!important;
  }

  .grillaInterior {
	display: flex;
	width: 100vw;
	column-gap: 2rem;
	}

	.divInt2 {
		width: 60vw!important;
		padding:1rem;
	}

	.divInt3 {
		width: 40vw!important;
	}
}

/* Media Query for Large screens */
@media (min-width: 1280px) {
	main {
		width: 100vw;	
	  }
	  .ojo-avisor {
		height: 50vh!important;
	  }
	  .item.item-b0 {    
		height: 50vh!important;
	  }
	  .item.item-b16 {
		height: 50vh!important;
	  }

	  .grillaInterior {
		display: flex;
		width: 80vw;
		margin: 1rem auto;
		column-gap: 10rem;
	}
}


/* comun a todos los tamaños de escritorio */
@media (min-width:768px) {

	/* bento */
	.grid {
		display: grid;
		grid-template-columns: repeat(4, 1fr);
		grid-template-rows: repeat(2, 1fr);
		gap: 8px;
	}

	.item {
		color: white;
	}

	.item-0 {
		grid-column: 1 / span 2;
		grid-row: 1;
	}

	.item-1 {
		grid-column: 3;
		grid-row: 1;
	}

	.item-2 {
		grid-column: 4;
		grid-row: 1;
	}

	.item-3 {
		grid-column: 1;
		grid-row: 2;
	}

	.item-4 {
		grid-column: 2 / span 2;
		grid-row: 2;
	}

	.item-5 {
		grid-column: 4;
		grid-row: 2;
	}

	.gridb {
    display: grid;
		grid-template-columns: repeat(4, 1fr);
		grid-template-rows: repeat(8, 1fr);
		gap: 8px;
		margin-top: 8px
	}

	.item-b0 {
		grid-column: 1 / span 2;
		grid-row: 1;
	}

	.item-b1 {
		grid-column: 3;
		grid-row: 1;
	}

	.item-b2 {
		grid-column: 4;
		grid-row: 1;
	}

	.item-b3 {
		grid-column: 1;
		grid-row: 2;
	}

	.item-b4 {
		grid-column: 2 / span 2;
		grid-row: 2;
	}

	.item-b5 {
		grid-column: 4;
		grid-row: 2;
	}

	.item-b6 {
		grid-column: 1;
		grid-row: 3;
	}

	.item-b7 {
		grid-column: 2;
		grid-row: 3;
	}

	.item-b8 {
		grid-column: 3 / span 2;
		grid-row: 3;
	}

	.item-b9 {
		grid-column: 1 / span 2;
		grid-row: 4;
	}

	.item-b10 {
		grid-column: 3 / span 2;
		grid-row: 4;
	}

	.item-b11 {
		grid-column: 1;
		grid-row: 5;
	}

	.item-b12 {
		grid-column: 2;
		grid-row: 5;
	}

	.item-b13 {
		grid-column: 3;
		grid-row: 5;
	}

	.item-b14 {
		grid-column: 4;
		grid-row: 5;
	}

	.item-b15 {
		grid-column: 1;
		grid-row: 6;
	}

	.item-b16 {
		grid-column: 2 / span 2;
		grid-row: 6;
	}

	.item-b17 {
		grid-column: 4;
		grid-row: 6;
	}

	.item-b18 {
		grid-column: 1 / span 2;
		grid-row: 7;
	}

	.item-b19 {
		grid-column: 3;
		grid-row: 7;
	}

	.item-b20 {
		grid-column: 4;
		grid-row: 7;
	}

	.item-b21 {
		grid-column: 1;
		grid-row: 8;
	}

	.item-b22 {
		grid-column: 2;
		grid-row: 8;
	}

	.item-b23 {
		grid-column: 3 / span 4;
		grid-row: 8;
	}

	.divInt1 {		
		height: 30vh;
	}

	.gridc {
		display: grid;
		grid-template-columns: repeat(4, 1fr);
		grid-template-rows: 1fr;		
		gap: 8px;
		margin-top: 8px
		}

	.item-c0 {
		grid-column: 1 / span 2;
		grid-row: 1;
	}

	.item-c1 {
		grid-column: 3;
		grid-row: 1;
	}

	.item-c2 {
		grid-column: 4;
		grid-row: 1;
	}
/*
	.item-c3 {
		grid-column: 4;
		grid-row: 1;
	}
*/	

	.divInt2 {
		width: 50vw;
		line-height: 1.5em;
	}

	.divInt2 h1 {
		margin-bottom: 3rem;

	}

	.divInt2 p {
		margin-bottom: 2rem;

	}

	.divInt3 {
		width: 50vw;
	}

}


@media print {
	.container-hp-masivo {
		display: flex;
		width: 100vw;
		height: 46vh;
		column-gap: 2rem;
		margin: 1rem 0;
		padding-top: 1rem;
		border-bottom: 1px solid black;
	}

	header,
	footer,
	.botongeneradormasivo {
		display: none;
	}
}

 /* Estilo para el fondo del modal */
 .modal-overlay {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.5);
	z-index: 1000;
}

/* Estilo para el contenedor del modal */
.modal {
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	background: white;
	padding: 20px;
	border-radius: 8px;
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
	z-index: 1100;
	max-width: 70vw;
	width: 70vw;
}

/* Botón para cerrar el modal */
.close-btn {
	background: red;
	color: white;
	border: none;
	padding: 10px 20px;
	border-radius: 5px;
	cursor: pointer;
}

/* Botón para abrir el modal */
.open-modal-btn {
	background: blue;
	color: white;
	border: none;
	padding: 10px 20px;
	border-radius: 5px;
	cursor: pointer;
	margin: 20px;
}

.close-btn:hover, .open-modal-btn:hover {
	opacity: 0.8;
}

.modal p {
	line-height: 1.5rem;
	margin-bottom: 1rem;;
}

#perdido .ojo-avisor {
	height: 82vh!important;
}

.log-entrada {

}

.log-datos {
	font-weight: 600;
	border-bottom: 1px solid gray;
}

.log-info {

}

.log-info ul {
	margin-left: 2rem!important;	
}

.log-info li {
	margin-bottom: 0.6em!important;
}

.log-info li li {
	margin-left: 1rem;
	margin-bottom: 0.6em!important;
}

.log-info li li li {
	margin-left: 1rem;
	margin-bottom: 0.6em!important;
}

.video-container {
	position: relative;	
}
.video-background iframe {
	position: relative;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;	
}

.video-background .content {
	position: relative;
	top: -92%;
	left: 50%;
	transform: translate(-50%, -50%);
	color: white;
	font-family: Arial, sans-serif;
	text-align: center;
	background-color: rgba(0, 0, 0, 0.5);
	padding: 10px;
	border-radius: 5px;
}

