/*Alineación (centrada) de la imagen dentro del slide*/
.slide-img{
	margin: auto;
	height: 150px;
}

/*Tipografía utilizado en los textos de cada slide*/
.carousel-caption{
	font-family: 'Roboto Slab', serif;
	font-size: 1.5em;
	width: 100%;
    left: 0;
    bottom: 0;
    padding-left: 20px;
    padding-right: 20px;
    padding-bottom: 80px;
    background-color: rgba(15, 15, 15, 0.8);
}

/*Pequeños círculos del carrusel*/
.carousel-indicators{
	bottom: -35px; /*Debajo de las imágenes*/
}

/*Modal con información adicional del LAIS. Se usa la clase .modal-lais para solo sobreescribir esta instancia de modal*/
.modal-lais div .modal-content{
	background-color: #ddd;
}
.modal-lais div .modal-content .modal-body, .modal-lais div .modal-content .modal-body p, .modal-lais div .modal-content .modal-body ul li{
	font-size: 1.1em;
}
.modal-lais div .modal-content .modal-body h4{
	margin: 1.5em 0;
}

/* Controla el tamaño de las imagenes de recursos en linea(metadoc, huellas de luz,..)*/
.imagen{
	width: 250px;
	height: 250px;
	display: inline-block;
	margin-top: 2em; /*Util para espaciar en version móvil*/
}

/*Color de texto en Recursos en línea*/
.text-muted{
	color: #b5b5b5;
}

/*Títulos en inicio (Recursos en línea)*/
.service-heading{
	font-size: 1.5em;
}

/*Subtítulos en inicio (Recursos en línea)*/
.service-subheading{
	height: 6em;
	font-size: 1em;
	font-style: italic;
}

/*Permite que los links no tengan un color diferente. Útil para encabezados de Publicaciones y Eventos*/
.link-other-color, .link-other-color:active, .link-other-color:focus, .link-other-color:hover, .link-other-color:visited{
	color: #ccc;
}

/*Imagenes representativas para la subsección de Publicaciones: mismo tamaño y centradas*/
.publicaciones-inicio{
	height: 350px;
	margin-left: auto;
    margin-right: auto;
}

/*Icono de la parte "intro"*/
#iconoLAIS{
	margin-top: calc(23px - 100%);
}

/*Secciones principales que alternan el color de fondo y color de texto*/
.bicolor-sections section:nth-child(odd){
	background-color: #eee;
	color: #333;
}
.bicolor-sections section:nth-child(even){
	background-color: #222222;
	color: #ccc;
}
.bicolor-sections section:nth-child(even) .section-heading{
	color: #ccc; /*Titulos blancos donde el fondo es negro*/
}
#intro{ /*.bicolor-sections section:first-child{*/
	padding: 100px 0;
	font-size: 1.25em;
}
.bicolor-sections p{
	font-family: 'Roboto Slab', serif;
	font-size: 1.25em;
}

/*Estilos para TimelineJS*/
.tl-slide .tl-slide-content-container .tl-slide-content{
	width: 100% !important;
}
/*Flechas derecha/izquierda*/
/*.tl-slidenav-next .tl-slidenav-content-container.tl-slidenav-inverted */
.tl-slidenav-icon{
	color: #b7b7b7 !important;
	text-shadow: none !important;
}
/*.tl-slidenav-next .tl-slidenav-content-container.tl-slidenav-inverted */
.tl-slidenav-title{
	color: #3c3c3c !important;
	text-shadow: none !important;	
}
.tl-slidenav-description{
	color: #484848 !important; 
	text-shadow: none !important;
}
.tl-text h2.tl-headline{
	/*font-size: 1.3em !important;*/
}

@media screen and (min-width: 768px) {
	/*Alineación (centrada) de la imagen dentro del slide*/
	.slide-img{
		margin: auto;
		height: 200px;
	}
}

@media screen and (min-width: 992px) {
	/*Alineación (centrada) de la imagen dentro del slide*/
	.slide-img{
		margin: auto;
		height: 250px;
	}
}

@media screen and (min-width: 1200px) {
	/*Alineación (centrada) de la imagen dentro del slide*/
	.slide-img{
		margin: auto;
		height: 350px;
	}
}