:root {
    --blanco: #ffffff;
    --oscuro: #212121;
    --primario: #0f4276;
    --primarioclaro: #006899;
    --degradado: #e2e3e4;
    --secundario: #fa8d26;
    --gris: #757575;
    --gris-claro: #e1e1e2;
    }

/* Globales*/
html {
   font-size: 62.5%;
}
body {
   font-size: 16px; /* 1rem = 10px*/
   font-family: 'Lucida Sans Unicode',sans-serif;
   background-color: var(--blanco);
   line-height: 1.8rem;
}
body {
   font-size: 16px; /* 1rem = 10px*/
   font-family: 'Myriad Pro/regular',sans-serif;
   background-color: var(--blanco);
   line-height: 1.8rem;
}


.contenedor {
   max-width: 120rem;
   margin: 0 auto;
}
.imagenes{
   justify-content: center;
}

/* Tipografia */
.parrafo{
   text-align: justify;
}
h1{
   font-size: 2.0rem; 
   margin: 0 0 3rem 0;
}
h2{
   font-size: 1.8rem; 
   margin: 0 0 3rem 0;
}
h3{
   font-size: 1.5rem; 
   margin: 0 0 3rem 0;
}


h1,h2,h3 {
   text-align: center;
   color: #0c457a;
}

.titulo-1{
   font-size: 1.3rem;
   color: #0c457a;
   font-weight:bold;
}
.titulo-2{
   font-size: 1.8rem;
   color: #0c457a;
   font-weight:bold;
}
.titulo-3{
   font-size: 2rem;
   color: #0c457a;
   font-weight:bold;
}
/* header*/
.header {
   display: flex;
   justify-content: center;
   background-color: var(--primario);
 }

 .header__logo {
   max-width: 120rem;
   width: 100%;
 }


/**Navegacion**/
.navegacion {
   background-color: var(--primario);
   padding: 1.2rem 0;
   display: flex;
   justify-content: center;
   gap: 2rem;
   margin: 0 0 1.2rem 0;
   /*gap: 2rem; * Separacion forma nueva en 2022 ahorita en 2023 lo soporta mejor pero Internet explorer aun no**/
 }
 .navegacion-principal {
   font-family: var(--fuentePrincipal);
   color: var(--blanco);
   font-size: 1.3rem;
   font-weight:400;
   margin-right: 2rem;
   text-decoration: none;
 }


/* Encabezado*/
 .crossmark {
   padding: 0 2rem 0 0;
   margin: 0 0 0 1rem;
 }

 .id,.doi,.tipo-articulo{
   font-family: var(--fuentePrincipal);
   font-size: 1.3rem;
   font-weight:bold;
   margin: 0 0 0 1rem;
 }
 .doi {
 color: #0f4276;
 }
.tipo-articulo{
   text-align: right;
   margin: 0 1rem 6rem 0;
}
/*Autores*/
.autores {
   justify-content: center;
   text-align: center;
   font-size: 1.3rem;
   margin: 5rem 0 6rem 0;
}
.afiliaciones{
   background-color: transparent;
   justify-content:center;
   text-align: left;
   font-size: 1.3rem;
}
@media (min-width: 768px) {
   .afiliaciones{
   margin: 0 30rem 2rem 30rem;
   padding: 1rem;
   }
 }
/*Highlights*/
 .highlights{
   background-color: var(--gris-claro);
   justify-content:center;
   text-align: justify;
   font-size: 1.2rem;
 }
 @media (min-width:720px) {
   .highlights{
   margin: 2rem 18rem 2rem 18rem;
   padding: 4rem 4rem 4rem 5rem;
   }
 }
/*Citacion*/
.citacion {
   background-color: transparent;
   justify-content:justify;
   text-align: left;
   font-size: 1.3rem;
}
@media (min-width: 768px) {
   .citacion{
   margin: 0 16rem 2rem 16rem;
   padding: 0rem 3rem 0rem 4rem;
   }
 }
 /** Fechas e ISSN**/
.nosotros{
   display: grid;
   grid-template-rows: repeat(2,auto);
}
@media (min-width: 768px) {
 .nosotros{
   grid-template-columns: repeat(2,1fr);
   column-gap: 2rem;
 }
}
.nosotros__contenido{
font-size: 1.5rem;
line-height: 1.2;
text-align:justify;
}
/*Contenido del articulo*/ 
.contenido{
   background-color: var(--gris-claro);
   justify-content:center;
   text-align: left;
   font-size: 1.3rem;
   padding: 5rem 5rem;
   margin: 3rem 8rem 3rem 8rem;
 }
.tablas{
   justify-content: center;
   font-size: 1rem;
}

/*ventana model Referencias*/
.modalDialog {
	position: fixed;
	font-family: Arial, Helvetica, sans-serif;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background: rgba(0,0,0,0.8);
	z-index: 99999;
	opacity:0;
	-webkit-transition: opacity 400ms ease-in;
	-moz-transition: opacity 400ms ease-in;
	transition: opacity 400ms ease-in;
	pointer-events: none;
}
.modalDialog:target {
	opacity:1;
	pointer-events: auto;
}
.modalDialog > div {
	width: 600px;
	position: relative;
	margin: 18% auto;
	padding: 10px 20px 13px 20px;
	border-radius: 8px;
	background: #fff;
	background: -moz-linear-gradient(#fff, #999);
	background: -webkit-linear-gradient(#fff, #999);
	background: -o-linear-gradient(#fff, #999);
  -webkit-transition: opacity 400ms ease-in;
-moz-transition: opacity 400ms ease-in;
transition: opacity 400ms ease-in;
}
.close {
	background: #606061;
	color: #FFFFFF;
	line-height: 25px;
	position: absolute;
	right: -12px;
	text-align: center;
	top: -10px;
	width: 24px;
	text-decoration: none;
	font-weight: bold;
	-webkit-border-radius: 12px;
	-moz-border-radius: 12px;
	border-radius: 12px;
	-moz-box-shadow: 1px 1px 3px #000;
	-webkit-box-shadow: 1px 1px 3px #000;
	box-shadow: 1px 1px 3px #000;
}
.close:hover { background: #00d9ff; }

/*ventana emergente afiliaciones (TOOLTIP)*/
.tooltip-container {
   position: relative; /*relative: los elementos se posicionan de forma relativa a su posición normal.*/
   display: inline-block;
 }
 
 .tooltip-text {
   visibility: hidden;
   width: 245px;
   background-color: #000;
   color: #fff;
   text-align:center;
   border-radius: 6px;
   padding: 5px;
   position: absolute;
   z-index: 1;
   top: 125%; /* Posiciona el tooltip bajo del elemento */
   left: 50%;
   transform: translateX(-50%);
   opacity: 0;
   transition: opacity 0.3s;
 }
 .tooltip-container:hover .tooltip-text {
   visibility: visible;
   opacity: 1;
 }
 

/*tabla*/
.table-responsive {
   display: block;
   width: 10%;
   overflow-x:auto;
}
.table-responsive2 {
   display: block;
   width: 100%;
   height: 85%;
   overflow-y: scroll;
}
.categorias{
   text-align: left;
}
table {
   font-size: 0.9rem;
   border-spacing: 0;
   border-collapse: collapse;
   width: 820px; /*tamañotabla*/
   margin: 0px auto;
}

td, th {
   border-top: 1.5px solid var(--primario);
   border-bottom: 1.5px solid var(--primario);
   padding: 1.5px;
   text-align: center;
   line-height: 1.4rem;   
}

tr:nth-child(even) {
   background-color: #ffffff;
}

td:nth-child(n + 3),
th:nth-child(n + 3) {
   text-align: center;
}

tbody tr:hover {
   background-color: rgb(235, 234, 234);
}

thead {
   background-color: rgb(252, 252, 252);
   color: var(--primario);
}


 /*imagenes*/
 @media (min-width: 620px) {
   .imagenes__fig{
      max-width: 80rem;
      width: 100%;
   }
}
@media (min-width: 1080px) {
   .imagenes__fig{
      max-width: 60rem;
      width: 80%; /* editar tamaño fig*/
   }
}
@media (min-width: 1080px) {
   .imagenes__fig2{
      max-width: 60rem;
      width: 50%;
   }
}
@media (min-width: 620px) {
   .imagenes__fig2{
      max-width: 60rem;
      width: 100%;
   }
}

/*contenedortabla*/

.ventanatabla{
   background-color: #ebebeb;
   border-radius: 4px;
   color: #070707;
   position: relative;
   padding: 1rem 2rem 1rem 2rem;
   margin: 1rem 1rem 1rem 1rem;
   border: 1.2px #b9b8b8 solid;
}

.contenedor {
   max-width: 1000px;
   width: 95%;
   margin: 0 auto;
}

.entrada-blog a {
   display: inline-block;
   background-color: var(--primario);
   color: white;
   padding: 10px 20px;
   text-decoration: none;
   font-weight:lighter;
   text-transform: uppercase;
}

@media (min-width: 768px) {
   .dos--columnas{
       display: grid;
       grid-template-columns: 100%;
       width: 95%;
       margin: 1rem;
      
      }
}

/*ventanaemergentetabla*/

.ventana{
   background-color:rgb(255, 255, 255);
   width:1080px;
   height: 290px;
   padding: 45px 0px 8px 0px;
   margin: 9% auto;
   position: relative;
 }

 .modal{
   background-color: rgba(0,0,0,.8);
   position:fixed;
   top:0;
   right:0;
   bottom:0;
   left:0;
   opacity:0;
   pointer-events:none;
   transition: all 1s;
   z-index: 100;
 }

 #IrVentanaFlotante:target{
   opacity:1;
   pointer-events:auto;
 }
  
 @media (min-width:1080px) {
   .ventana{
      width:1000px;
    }
 }
 @media (min-width:600px) {
   .ventana{
      width:900px;
    }
 }





 /*tabla2*/
 
 
 .ventana2{
   background-color:rgb(255, 255, 255);
   width:1800px;
   height: 380px;
   padding: 45px 0px;
   margin: 5% auto;
   position: relative;
 }

 .modal2{
   background-color: rgba(0,0,0,.8);
   position:fixed;
   top:0;
   right:0;
   bottom:0;
   left:0;
   opacity:0;
   pointer-events:none;
   transition: all 1s;
   z-index: 100;
 }

 #IrVentana2:target{
   opacity:1;
   pointer-events:auto;
 }
  
 @media (min-width:1080px) {
   .ventana2{
      width:1000px;
    }
 }
 @media (min-width:600px) {
   .ventana2{
      width:900px;
    }
 }
 
/*tabla3*/
 
 
.ventana3{
   background-color:rgb(255, 255, 255);
   width:680px;
   height: 350px;
   padding: 45px 0px 10px 0px;
   margin: 6% auto;
   position: relative;
 }

 .modal3{
   background-color: rgba(0,0,0,.8);
   position:fixed;
   top:0;
   right:0;
   bottom:0;
   left:0;
   opacity:0;
   pointer-events:none;
   transition: all 1s;
   z-index: 100;
 }

 #IrVentana3:target{
   opacity:1;
   pointer-events:auto;
 }
  
 @media (max-width:1080px) {
   .ventana3{
      width:1080px;
    }
 }
 @media (min-width:600px) {
   .ventana3{
      width:940px;
    }
 }

 /*tabla4*/
 
 
.ventana4{
   background-color:rgb(255, 255, 255);
   width:650px;
   height: 320px;
   padding: 45px 0px 7px 0px;
   margin: 7% auto;
   position: relative;
 }

 .modal4{
   background-color: rgba(0,0,0,.8);
   position:fixed;
   top:0;
   right:0;
   bottom:0;
   left:0;
   opacity:0;
   pointer-events:none;
   transition: all 1s;
   z-index: 100;
   

 }

 #IrVentana4:target{
   opacity:1;
   pointer-events:auto;
 }
  
 @media (min-width:1080px) {
   .ventana4{
      width:1000px;
    }
 }
 @media (min-width:600px) {
   .ventana4{
      width:900px;
    }
 }

 /*tabla5*/
 
 
.ventana5{
   background-color:rgb(255, 255, 255);
   width:650px;
   height: 380px;
   padding: 45px 0px 7px 0px;
   margin: 6% auto;
   position: relative;
 }

 .modal5{
   background-color: rgba(0,0,0,.8);
   position:fixed;
   top:0;
   right:0;
   bottom:0;
   left:0;
   opacity:0;
   pointer-events:none;
   transition: all 1s;
   z-index: 100;
   

 }

 #IrVentana5:target{
   opacity:1;
   pointer-events:auto;
 }
  
 @media (min-width:1080px) {
   .ventana5{
      width:1000px;
    }
 }
 @media (min-width:600px) {
   .ventana5{
      width:900px;
    }
 }
 /*tabla6*/
 
 
.ventana6{
   background-color:rgb(255, 255, 255);
   width:650px;
   height: 380px;
   padding: 45px 0px 7px 0px;
   margin: 6% auto;
   position: relative;
 }

 .modal6{
   background-color: rgba(0,0,0,.8);
   position:fixed;
   top:0;
   right:0;
   bottom:0;
   left:0;
   opacity:0;
   pointer-events:none;
   transition: all 1s;
   z-index: 100;
   

 }

 #IrVentana6:target{
   opacity:1;
   pointer-events:auto;
 }
  
 @media (min-width:1080px) {
   .ventana6{
      width:1000px;
    }
 }
 @media (min-width:600px) {
   .ventana6{
      width:900px;
    }
 }
 /*tabla7*/
 
 
.ventana7{
   background-color:rgb(255, 255, 255);
   width:600px;
   height: 380px;
   padding: 45px 0px 7px 0px;
   margin: 6% auto;
   position: relative;
 }

 .modal7{
   background-color: rgba(0,0,0,.8);
   position:fixed;
   top:0;
   right:0;
   bottom:0;
   left:0;
   opacity:0;
   pointer-events:none;
   transition: all 1s;
   z-index: 100;
   

 }

 #IrVentana7:target{
   opacity:1;
   pointer-events:auto;
 }
  
 @media (min-width:1080px) {
   .ventana7{
      width:1000px;
    }
 }
 @media (min-width:600px) {
   .ventana7{
      width:900px;
    }
 }
 /*tabla8*/
 
 
.ventana8{
   background-color:rgb(255, 255, 255);
   width:600px;
   height: 380px;
   padding: 45px 0px 7px 0px;
   margin: 6% auto;
   position: relative;
 }

 .modal8{
   background-color: rgba(0,0,0,.8);
   position:fixed;
   top:0;
   right:0;
   bottom:0;
   left:0;
   opacity:0;
   pointer-events:none;
   transition: all 1s;
   z-index: 100;
   

 }

 #IrVentana8:target{
   opacity:1;
   pointer-events:auto;
 }
  
 @media (min-width:1080px) {
   .ventana8{
      width:1000px;
    }
 }
 @media (min-width:600px) {
   .ventana8{
      width:900px;
    }
 }