/* Display lists in a grid of fixed size. This is useful when lists have associated images. */
/* Idea from http://blog.mozilla.org/webdev/2009/02/20/cross-browser-inline-block/ */
li.grid
{
    min-width: 100px;
    height: 100px;
    /*border: 1px solid #000;*/
    display: -moz-inline-stack;
    display: inline-block;
    vertical-align: top;
    margin: 10px;
    zoom: 1;
    *display: inline;
    _height: 100px;
    text-align: center;
}
/* Formatting for each item in a 2D grid. This is used typically in the downloads section. */
.griditem
{
    font-size: 10pt;
    text-align: center;
    display: inline;
}
.griditem img
{
    text-align: center;
    height:100px;
    /*width:100px;*/
    border: 1px solid #eee;
    box-shadow: 0px 0px 2px #444444;
}

/* GENERAL */
* {
	outline: none !important;
}

html {
	height: 100%;
}

body {
	/*font-weight: 300;*/
	/*padding-top: 70px;*/
	height:100%;
	font-size: 15px;
	/* Fons gris */
	/*background-color: #DEDEDE;*/
	background-color: #FFFFFF;
	
}

/* Amplada maxima de tot el cos. Falta solucionar una cosa, pero casi ho tenim */
.container-fluid {
	margin-right: auto;
	margin-left: auto;
	max-width: 1280px;
}

.imgdan {
	float:left;
	width: 90px;
	margin-right: 10px;
}

/* Aixo ho he fet per que el contingut sino es solapa amb la barra */
#top {
	padding-top: 70px;
}

/* Classe que dona color al cos de la web (fons blanc) */
.cos {
	background-color: white;
}

p {
	margin-top: 15px;
	margin-bottom: 20px;
}

a {
	color: #3c763d;
}

h3 {
	font-weight: bold;
	margin-top: 0px;
	margin-bottom: 20px;
}

a:hover {
	/*text-decoration: none;*/
	color: #2b542c;
}

table, table tr {
	font-size: 15px;
	/*font-weight: 200;*/
	vertical-align: top;
	border: none !important;
	line-height: 20px;
}
/* FI GENERAL */


/* Arreglos per pantalles de mobil */
@media (max-width: 767px) {
	.navbar-brand {
		padding-left: 15px;
	}

	.social-icons {
		float: left !important;
		text-align: center;
	}

	.social-icons {
		margin-right: 15px;
		margin-left: -10px;
	}

	.social-icons img {
		margin-top: 0px;
		margin-bottom: 15px;
		width: 150px;
	}
}
/* FI NAVBAR */

/* RESEARCH */
.imgres {
	margin-right: 10px;
	width: 159px;
}

.btn-group {
	margin-top: 7px;
}

.btn-group .btn-success {
	color: #468847;
	background-color: rgba(223,240,216,0.3);
	border: 1px solid #d6e9c6;
}

.btn-group .btn-success:hover {
	background-color: rgba(207,232,196,1);
}
/* FI RESEARCH */

/* AJUSTEM MIDES SEGONS RESOLUCIO */
@media (max-width: 767px) {
/* Al haver de posar container-fluid al navbar per fixar una mida maxima d'ample m'apareixia un padding extra al arriba a aquesta mida.*/
	.navbar .container-fluid {
		padding-right: 0px;
		padding-left: 0px;
	}
}

@media (min-width: 768px) {

}

@media (min-width: 992px) {

}

@media (min-width: 1200px) {

}

/* ---- PUBLICATIONS ---- */

.publications p {
	margin: 0
}

.publications{
	font-family: 'Roboto';
}
.publications > p{margin-top:40px;text-align:center;font-size:1.2em}
.publications > p > a{color:#636363}
.publications > p > a:hover{color: white}

/* .paper-summary{display:flex;width:95%;max-width:1000px;min-height:140px;position:relative;margin:20px auto;padding:20px;background-color:#fefefe;border-radius:5px;box-shadow: 0 0 25px rgba(5,5,38,0.1);overflow:hidden;font-size:1.3em;line-height:1.4em} */
.paper-summary{
    display:flex;max-width:1000px;position:relative;margin: 20px auto; font-size:1.3em;line-height:1.4em;
background:white; box-shadow: 0 0 25px rgba(5,5,38,0.1);  }
.paper-summary img{margin:0;display:inline-block;width:250px;object-fit: cover; height: 100%; max-height:245px}

.paper-info{display:inline-block; padding: 1em; padding-bottom: 0.85em;}
.paper-summary .title{font-weight:600; color: #2c2935; font-family:'Hind Madurai'; font-size: 1.0em; margin-top: -0.25em;}
.paper-summary .journal{font-weight:lighter; font-size:.85em; margin-top: 0.25em}
.paper-summary .authors{font-size:.9em; font-weight:500; color: #222222; line-height: 1.4em; margin-top: 3px}
/* .paper-summary .authors > a{color:#ec4779;text-decoration:none}
.paper-summary .authors > a:hover{text-decoration:underline} */

@media screen and (max-width: 500px) {
    .paper-summary{display:block}
    .paper-summary img{width:100%;margin-bottom:10px}
}


.resources{vertical-align:middle;margin-top:0.4em;line-height:1.2em;text-align:left}
.resources > a{border: 1px solid rgba(0, 0, 0, 0.01); display:inline-block;padding:.25rem .75rem;background-color:#f0f0f0;color:#969696;border-radius:.2rem;font-weight:500;font-size:.7em;text-decoration:none}
.resources > a:hover{color:#fff;background-color:#ec4779}
.resources > a > i{color:#858585}
.resources > a:hover > i{color:#fff}
.resources>.resources:not(:last-child)>a,.resources>a:not(:last-child):not(.dropdown-toggle){border-top-right-radius:0;border-bottom-right-radius:0;border-right:none}
.resources>.resources:not(:first-child)>a,.resources>a:not(:first-child){border-top-left-radius:0;border-bottom-left-radius:0}

h2 {padding-top: 1em}
h3 {padding-top: 1em}

/* Header */
header{display: block;
    width: 100%; height: 78px; top:0; left:0;  z-index: 50;
    position: absolute; margin: 0; width: 100%;left: 0; right: 0; padding: 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.11); 
    background-color: rgba(0, 0, 0, 0.1);
}

.navbar{display: block; position: absolute; right: 0; top:0; line-height: 78px; margin-right: 4%}
.navbar a{font-size: 1.4em; 
    font-weight: 600;
    text-decoration: none; 
    margin-left: 1.25em; font-family: 'Hind Madurai'; font-variant-caps: all-small-caps; color: rgb(240, 240, 240);}
.navbar a:hover{color: #ec4779;}
.nav-active{border-bottom: 3px solid #ec4779; padding-bottom: 10px;}

.navbar-mobile{position: absolute; height: 78px; width: 60px; top: 0; right:0; visibility: hidden;}
.navbar-mobile i{line-height: 78px; font-size: 3em; color: #ffffffbe;}
.navbar-mobile i:hover{color: #ec4779;}
.navbar-mobile a {text-decoration: none;}

.navbar-section{position:absolute; top:78px; right:0; width:200px; text-align: center; background-color: rgb(255, 255, 255)}
.navbar-section.show{visibility: visible; z-index: 0}
.navbar-section.hide{visibility: hidden;}

.nb-section{display: block; font-size: 1.5em; line-height: 2.0em; text-decoration: none;  font-variant-caps: all-small-caps; color:rgb(0, 0, 0)}
.nb-section:hover{background-color: #ec4779; color: white;}

a.header-title {text-decoration: none;}
.header-title{display:inline-block;line-height:78px;font-family:'Hind Madurai', sans-serif;font-size:2.4em;font-weight:bolder;
    text-decoration:none;z-index:50; margin-left: 4%}
.header-title #ms {color: #ffffff; font-family:'Hind Madurai', sans-serif;}
.header-title #lab {color: #ffffff; opacity: 0.7; font-family:'Hind Madurai', sans-serif;}

header.opaque {
    background-color: rgb(255, 255, 255);
    box-shadow: 0 0 25px rgba(5, 5, 38, 0.055);
}

header.opaque a {
    color: #322e3d;
}

header.opaque .header-title #ms {color: #ec4779; }
header.opaque .header-title #lab {color: #322e3d; opacity: 1.0;}
header.opaque .navbar-mobile i {color: #322e3d;}


@media screen and (max-width: 650px) {
	h1 {padding-top: 0}
    .navbar{visibility: hidden;}
    .navbar-mobile{visibility: visible;}
    .header-title #ms {color: #ec4779; }
    .header-title #lab {color: #322e3d; opacity: 1.0;}
    .navbar-mobile i {color: #322e3d;}
    header {
        background-color: rgb(255, 255, 255);
        box-shadow: 0 0 25px rgba(5, 5, 38, 0.055);
    }
}