
body {
    margin: 5.5em 0.6em 3em;
    font-family: Arial, Helvetica, sans-serif;
    /*font-size: 100%; /* es 16px */
    /*font-size: calc(15px + 0.390625vw); Original de https://matthewjamestaylor.com/responsive-font-size*/
    font-size: calc(16px + 0.2vw); */
}

/* Carrusel Contenedor general */
#myCarousel {
    max-width: 1000px;
    margin: auto;
}

/* Slides */
.carousel-item {
    background-color: #fff; /* fondo para espacios laterales */
    text-align: center;
}

/* Imágenes responsive SIN recorte */
.carousel-item img {
    width: 100%;
    height: auto;
    max-height: 80vh;
    object-fit: contain;
}

/* 1. Cambiar el color de las flechas (anterior y siguiente) */
.carousel-control-prev-icon,
.carousel-control-next-icon
{
    filter: invert(1) grayscale(100%) brightness(0%) !important;
}

/* 2. Cambiar el color de los rectángulos (Indicadores de posición) */
.carousel-indicators [data-bs-target] {
  background-color: #000000 !important; /* Color de los rectángulos inactivos (ej: Rojo) */
  opacity: .5; /* Opacidad para los que no están seleccionados */
}

/* 3. Cambiar el color del rectángulo de la imagen activa/actual */
.carousel-indicators .active {
  background-color: #ff0000 !important; /* Color del rectángulo activo (ej: Negro) */
  opacity: 1;
}


/* Para que no ponga underline en los enlaces */
a {
    text-decoration: none;
}

/* Ajustes de la NavBar */
.navbar-custom {  
    background-color: #000;  
}  
  
.navbar-custom .nav-link,
.navbar-custom .navbar-toggler-icon,
.navbar-custom .navbar-brand {
  color: #6CC;
  border-radius: 0.25em;
}

.navbar-custom .navbar-toggler {
    color: #6CC;
    border-color: #6CC;
}

.navbar-custom a:hover {
    color: #000;
    background-color: #6cc;
}

.navbar-nav > li > .dropdown-menu {
    background-color: #000;
}

.navbar-nav > li > .dropdown-menu a{
    color: #6cc;
}

.navbar-nav > li > .dropdown-menu a:hover{
    color: #000;
    background-color: #6cc;
}

/* Formato de títulos */
h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6{
    color:#30737A;
    padding:0px;
    margin:0px;
    font-family:inherit;
    font-weight: normal; /* Equivale a 400 */
    line-height:1.1;
}

h3 {
    border-bottom: 2px solid #30737A;
    /*margin-right: 25%; */
    margin-bottom: 0;
}

h4 {
    border-bottom: 1.5px solid #30737A;
    width: 33%;
    margin-bottom: 14px;
    
}

.datos {
margin-top: 0.2em;
margin-left: 0.6em;
font-variant: small-caps;
/*font-style: italic; */
}

.date {
color:#222222;
padding-top:5px;
padding-right:8px;
padding-left:8px;
padding-bottom:8px;
font-size: 12px;
text-align: left;
}

/* Formato de dos columnas */
.columns {
    columns: 2 20em;
    column-gap: 2em;
    /* column-rule: 1px solid #cecece; */
}

/* Formato para listas */
#mylist {
    /* list-style-image: url(img/star.svg); */
    list-style: none;
    margin-left: 0em;
    /* line-height: 1.5; */ /* Separación entre líneas, defecto 1.5 */
    padding-left: 1.5em;
    text-indent: -1.5em;   /* sangría francesa */
    /* Para añadir espacio entre los items */
    display: flex;
    flex-direction: column;
    gap: .5em;
    
}

.publication .journal-reference p {
  margin: 0 0 1em 0;      /*  márgenes opcionales */
  padding-left: 1.5em;     /* espacio antes de la primera línea */
  text-indent: -1.5em;     /* mueve la primera línea hacia la izquierda */
}

.publication {
    display: grid;
    grid-template-columns: auto 1fr;
    column-gap: 1rem;
    align-items: start;
    margin-bottom: 2rem
}

.journal-image img {
    width: 70px;
    height: auto;
    display: block;
}

.journal-reference {
    margin: 0;
    line-height: 1.5;
}

.author {
    font-variant: small-caps;
}

.title {
    font-weight: 500;
}

.journal {
    color: #4679AC;
    font-style: italic;
}

.conference {
    color: #4679AC;
    font-style: italic;
}

.pdficon{
    height:1.2em;
    vertical-align:-0.15em;
}


/*************************************
   Para hacer zoom al pasar el ratón por encima
 *************************************/
 .img-contenedor img {
    -webkit-transition: all .5s ease; /* Safari y Chrome */
    -moz-transition:all 1.2s ease; /* Firefox */
    -o-transition:all .9s ease; /* IE 9 */
    -ms-transition:all .9s ease; /* Opera */
    width:100%;
    }
    .img-contenedor:hover img {
    -webkit-transform:scale(1.25);
    -moz-transform:scale(1.25);
    -ms-transform:scale(1.25);
    -o-transform:scale(1.25);
    transform:scale(1.25);
    }
    .img-contenedor {/*Ancho y altura son modificables al requerimiento de cada uno*/
    /*width:300px;
    height:180px;*/
    overflow:hidden;
    }

/*Cambia el tamaño al verlo en el móvil */
@media only screen and (max-width: 700px) {
    body{
      font-size: 105%;
    }
    h4 {
        width: 50%;
    }
}

/*
@media only screen and (min-width: 1290px) {
  body{
    font-size: 110%;
  }
}
*/

/* Ajustes para móvil 
@media (max-width: 768px) {

    .texto {
        font-size: 1.2rem;
        top: 10px;
        left: 10px;
        padding: 6px 12px;
    }

    .carousel-item img {
        max-height: 50vh;
    }
}
*/
