/* ! HTML5 Boilerplate v4.3.0 | MIT License | http://h5bp.com/ */

html,button,input,select,textarea{color:#222;}
html{font-size:1em;line-height:1.4;}
::-moz-selection{background:#b3d4fc;text-shadow:none;}
::selection{background:#b3d4fc;text-shadow:none;}
hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0;}
audio,canvas,img,video{vertical-align:middle;}
fieldset{border:0;margin:0;padding:0;}
textarea{resize:vertical;}
.browsehappy{margin:0.2em 0;background:#ccc;color:#000;padding:0.2em 0;}


/* ==========================================================================
Grid style - Skeleton
========================================================================== */

@media only screen and (max-width: 767px) {
	.container                                  { position: relative; width: 280px; margin: 0 auto; padding: 0; }
	.container .column,
	.container .columns                         { float: left; display: inline; margin-left: 0px; margin-right: 10px; }
	.row                                        { margin-bottom: 20px; }
	
	/* Nested Column Classes */
	.column.alpha, .columns.alpha               { margin-left: 0; }
	.column.omega, .columns.omega               { margin-right: 0; }
	
	/* Base Grid */

	.container .one.column,
	.container .one.columns,
	.container .two.columns,
	.container .three.columns,
	.container .four.columns,
	.container .five.columns,
	.container .six.columns,
	.container .seven.columns,
	.container .eight.columns,
	.container .nine.columns,
	.container .ten.columns,
	.container .eleven.columns,
	.container .twelve.columns,
	.container .thirteen.columns,
	.container .fourteen.columns,
	.container .fifteen.columns,
	.container .sixteen.columns,
	.container .one-third.column,
	.container .two-thirds.column  { width: 280px; }
}

@media screen and (min-width: 767px) and (max-width: 1280px) {
	.container                                  { position: relative; width: 960px; margin: 0 auto; padding: 0; }
	.container .column,
	.container .columns                         { float: left; display: inline; margin-left: 10px; margin-right: 10px; }
	.row                                        { margin-bottom: 20px; }
	
	/* Nested Column Classes */
	.column.alpha, .columns.alpha               { margin-left: 0; }
	.column.omega, .columns.omega               { margin-right: 0; }
	
	/* Base Grid */
	.container .one.column,
	.container .one.columns                     { width: 40px;  }
	.container .two.columns                     { width: 100px; }
	.container .three.columns                   { width: 160px; }
	.container .four.columns                    { width: 220px; }
	.container .five.columns                    { width: 280px; }
	.container .six.columns                     { width: 340px; }
	.container .seven.columns                   { width: 400px; }
	.container .eight.columns                   { width: 460px; }
	.container .nine.columns                    { width: 520px; }
	.container .ten.columns                     { width: 580px; }
	.container .eleven.columns                  { width: 640px; }
	.container .twelve.columns                  { width: 700px; }
	.container .thirteen.columns                { width: 760px; }
	.container .fourteen.columns                { width: 820px; }
	.container .fifteen.columns                 { width: 880px; }
	.container .sixteen.columns                 { width: 940px; }
}

@media screen and (min-width: 1280px) {
	.container                                  { position: relative; width: 1200px; margin: 0 auto; padding: 0; }
	.container .column,
	.container .columns                         { float: left; display: inline; margin-left: 12.5px; margin-right: 12.5px; }
	.row                                        { margin-bottom: 20px; }
	
	/* Nested Column Classes */
	.column.alpha, .columns.alpha               { margin-left: 0; }
	.column.omega, .columns.omega               { margin-right: 0; }
	
	/* Base Grid */
	.container .one.column,
	.container .one.columns                     { width: 50px;  } 
	.container .two.columns                     { width: 125px; } 
	.container .three.columns                   { width: 200px; }
	.container .four.columns                    { width: 275px; } 
	.container .five.columns                    { width: 350px; }
	.container .six.columns                     { width: 425px; }
	.container .seven.columns                   { width: 500px; }
	.container .eight.columns                   { width: 575px; }
	.container .nine.columns                    { width: 650px; }
	.container .ten.columns                     { width: 725px; }
	.container .eleven.columns                  { width: 800px; }
	.container .twelve.columns                  { width: 875px; }
	.container .thirteen.columns                { width: 950px; }
	.container .fourteen.columns                { width: 1025px; }
	.container .fifteen.columns                 { width: 1100px; } 
	.container .sixteen.columns                 { width: 1175px; }
}

/* ==========================================================================
Author's custom styles
========================================================================== */


/* --- STRUCTURE --- */

body{ font-family: 'Lato', sans-serif; font-size:16px; font-weight: 300; }
p{ line-height: 22px; }
a{ text-decoration: none; font-style: italic; color: #FFF; }
li {margin: 0 0 10px;}
h2{ font-size: 24px; font-weight: 700; margin: 30px 0 10px 0; }

.wire { padding: 0; margin: 0; list-style: none; }
.wire-publications{ padding: 0; margin: 0; list-style: none; }
.wire-publications li { display: inline; margin-bottom: 2px; white-space: nowrap; }

@media only screen and (max-width: 767px) {
	.container{ width: 300px; padding: 40px 10px 0 10px; }
	.container > aside{ width: 280px; padding: 20px 10px; background: #FFF; }
	.container .nav-social{ margin-top: 10px;}
	.container .content{ width: 280px; padding: 20px 10px; background: #FFF; }
	.content.right { float: left;}

	footer{ width: 300px; clear: right; padding-top: 25px; }
	footer .label.left{ margin-right: 15px; }
	footer .label.right{ padding-right: 15px; float: left; text-align: left;}
}

@media screen and (min-width: 767px) and (max-width: 1280px) {
	.container{ padding-top: 100px; }
	.container > aside{ width: 210px; padding: 20px 10px; background: #FFF; }
	.container .nav-social{ margin-top: 10px;}
	.container .content{ width: 700px; padding: 20px 10px; background: #FFF; }

	footer{ width: 720px; clear: right; padding-top: 25px; }
	footer .label.left{ margin-right: 15px; }
	footer .label.right{ padding-right: 15px; }
}

@media screen and (min-width: 1280px) {
	.container{ padding-top: 125px; }
	.container > aside{ width: 262.5px; padding: 25px 12.5px; background: #FFF; } 
	.container .nav-social{ margin-top: 12.5px;}
	.container .content{ width: 875px; padding: 25px 12.5px; background: #FFF; }

	footer{ width: 900px; clear: right; padding-top: 25px; }
	footer .label.left{ margin-right: 15px; }
	footer .label.right{ padding-right: 15px; }
}



/* --- LAYOUT --- */

.home{ background: #e3ffff url('../images/bg-home.png') top center no-repeat; }
.publications{ background: #bef3f3 url('../images/bg-publications.png') top center no-repeat; }
.research{ background: #d1e8e8 url('../images/bg-research.png') top center no-repeat; }
.research-students{ background: #d1e8e8 url('../images/bg-research.png') top center no-repeat; }
.presentations{ background: #80a1a1 url('../images/bg-presentations.png') top center no-repeat; }
.courses{ background: #b1c9c9 url('../images/bg-courses.png') top center no-repeat; }
.events{ background: #76bbbb url('../images/bg-events.png') top center no-repeat; }
.miscellaneous{ background: #9cd2d2 url('../images/bg-miscellaneous.png') top center no-repeat; }

.sprite{ background: url('../images/sprite.png') no-repeat; display: block; }
h1 .ico{ width:30px; height: 32px; margin: 5px 10px 0 0; float: left;}
.publications h1 .ico{ background-position: -276px -35px; }
.research h1 .ico{ background-position: -20px -33px; }
.research-students h1 .ico{ background-position: -20px -33px; }
.presentations h1 .ico{ background-position: -212px -33px; }
.courses h1 .ico{ background-position: -341px -34px; }
.events h1 .ico{ background-position: -84px -33px; }
.miscellaneous h1 .ico{ background-position: -150px -35px; }
.socialmedia h1 .ico{ background-position: -395px -35px; }

.columns .ico.min{ width: 22px; height: 22px; margin: 5px 10px 5px 0; }
.publications.ico{ background-position: -614px -40px; }
.research.ico{ background-position: -667px -40px; }
.research-students.ico{ background-position: -667px -40px; }
.presentations.ico{ background-position: -560px -40px; }
.courses.ico{ background-position: -721px -40px; }
.events.ico{ background-position: -507px -40px; }
.miscellaneous.ico{ background-position: -455px -40px; }
.socialmedia.ico{ background-position: -764px -39px; }

.sprite-social{ background: url('../images/sprite-social.png') no-repeat; display: block; }
.nav-social .ico{ width: 21px; height: 21px; margin-right: 5px; float: left;}
.googleplus{ background-position: -1px -1px; }
.linkedin{ background-position: -23px -1px; }
.twitter{ background-position: -45px -1px; }
.googlescholar{ background-position: -67px -1px; }

.container .nav-main header h1{ font-size: 32px; font-weight: 700; margin: 0; border-bottom: 3px solid #222; clear: both; }
.container .nav-main header p{ font-size: 14px; line-height: 18px; font-weight: 300; }
.container .nav-main a{ font-style: normal; color: #222; }
.container .nav-main a:hover{ font-style: normal; color: #444; }
.container .nav-main nav a{ display: block; font-weight: 600; margin-bottom: 8px; }

.container .nav-social p{ font-size: 16px; font-weight: 700; margin: 8px 0 16px 0;}
.container .nav-social a{ font-style: italic; color: #FFF; background: #57aeae; padding: 1px 10px; margin: 0 3px; }
.container .nav-social a:hover{ color: #222; background: #CCC; padding: 1px 10px; margin: 0 3px; }

.container .content header h1{ font-size: 32px; font-weight: 700; margin: 0 0 15px 0; border-bottom: 3px solid #222; }
.container .content a{ font-style: italic; color: #FFF; background: #57aeae; padding: 1px 10px; margin: 0 3px; }
.container .content a:hover{ color: #222; background: #CCC; padding: 1px 10px; margin: 0 3px; }
.container .content a.none { background: none; margin: 0; padding-left: 0px; }
.container .content a.none:hover { background: none; margin: 0; padding-left: 0px; }
.container .content a.more{ margin: 0 5px; font-size: 18px; padding: 0 5px 2px; }
.container .content a.nav-publications{ font-style: normal; font-weight: 600; color: #222; background: none; line-height: 24px; margin: 0;}
.container .content a.nav-publications:hover{ color: #444; }
.container .content img.h100 { width: auto; height: 100px;}


.home .columns { margin-bottom: 40px; }
.featured-box { border-top: 2px solid #222; }
.home .columns header{ padding-top: 10px; }
.home .columns header h1{ font-size: 22px; font-weight: 700; line-height: 30px; float: left; border-bottom: none; }
.home .columns header h1 a{ font-style: normal; color: #222; background: none; font-size: 22px; font-weight: 700; line-height: 30px; float: left; border-bottom: none; padding: 0; margin: 0;}
.home .columns header h1 a:hover{ font-style: normal; color: #444; background: none; font-size: 22px; font-weight: 700; line-height: 30px; float: left; border-bottom: none; padding: 0; margin: 0;}
.home .columns p{ margin: 5px 0; }

footer p{ font-size: 13px; line-height: 16px; }
footer a{ color: #000; font-style: normal; }
footer small{ font-size: 11px; }


/* ==========================================================================
Helper classes
========================================================================== */

.ir{background-color:transparent;border:0;overflow:hidden;*text-indent:-9999px;}
.ir:before{content:"";display:block;width:0;height:150%;}
.hidden{display:none!important;visibility:hidden;}
.visuallyhidden{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;}
.visuallyhidden.focusable:active,.visuallyhidden.focusable:focus{clip:auto;height:auto;margin:0;overflow:visible;position:static;width:auto;}
.invisible{visibility:hidden;}
.clearfix:before,.clearfix:after{content:" ";display:table;}
.clearfix:after{clear:both;}
.clearfix{*zoom:1;}
.clear{ clear: both;}
.left{ float: left; }
.right{ float: right; }
.align_left{ text-align: left; }
.align_right{ text-align: right; }
.align_center{ text-align: center; }



/* ==========================================================================
Print styles
========================================================================== */

@media print{
	*{background:transparent!important;color:#000!important;box-shadow:none!important;text-shadow:none!important;}
	a,a:visited{text-decoration:underline;}
	a[href]:after{content:" (" attr(href) ")";}
	abbr[title]:after{content:" (" attr(title) ")";}
	.ir a:after,a[href^="javascript:"]:after,a[href^="#"]:after{content:"";}
	pre,blockquote{border:1px solid #999;page-break-inside:avoid;}
	thead{display:table-header-group;}
	tr,img{page-break-inside:avoid;}
	img{max-width:100%!important;}
	@page{margin:0.5cm;}
	p,h2,h3{orphans:3;widows:3;}
	h2,h3{page-break-after:avoid;}
}

/* ==========================================================================
jQuery Nivo Slider v3.2
http://nivo.dev7studios.com

Copyright 2012, Dev7studios
Free to use and abuse under the MIT license.
http://www.opensource.org/licenses/mit-license.php
========================================================================== */

/* The Nivo Slider styles */

@media only screen and (max-width: 767px) {
	.nivoSlider {
	position:relative;
	width:280px;
	height:150px;
	overflow: hidden;
	}
}

@media only screen and (min-width: 767px) {
	.nivoSlider {
	position:relative;
	width:100%;
	height:375px;
	overflow: hidden;
	}
}

.nivoSlider img {
	position:absolute;
	top:0px;
	left:0px;
	max-width: none;
}
.nivo-main-image {
	display: block !important;
	position: relative !important; 
	width: 100% !important;
}

/* If an image is wrapped in a link */
.nivoSlider a.nivo-imageLink {
	position:absolute;
	top:0px;
	left:0px;
	width:100%;
	height:100%;
	border:0;
	padding:0;
	margin:0;
	z-index:6;
	display:none;
	background:white; 
	filter:alpha(opacity=0); 
	opacity:0;
}
/* The slices and boxes in the Slider */
.nivo-slice {
	display:block;
	position:absolute;
	z-index:5;
	height:100%;
	top:0;
}
.nivo-box {
	display:block;
	position:absolute;
	z-index:5;
	overflow:hidden;
}
.nivo-box img { display:block; }

/* Caption styles */
.nivo-caption {
	position:absolute;
	left:0px;
	bottom:0px;
	background:#000;
	color:#fff;
	width:100%;
	z-index:8;
	padding: 5px 10px;
	opacity: 0.8;
	overflow: hidden;
	display: none;
	-moz-opacity: 0.8;
	filter:alpha(opacity=8);
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	-moz-box-sizing: border-box;    /* Firefox, other Gecko */
	box-sizing: border-box;         /* Opera/IE 8+ */
}
.nivo-caption p {
	padding:5px;
	margin:0;
}
.nivo-caption a {
	display:inline !important;
}
.nivo-html-caption {
    display:none;
}
/* Direction nav styles (e.g. Next & Prev) */
.nivo-directionNav a {
	position:absolute;
	top:45%;
	z-index:9;
	cursor:pointer;
}
.nivo-prevNav {
	left:0px;
}
.nivo-nextNav {
	right:0px;
}
/* Control nav styles (e.g. 1,2,3...) */
.nivo-controlNav {
	text-align:center;
	padding: 15px 0;
}
.nivo-controlNav a {
	cursor:pointer;
}
.nivo-controlNav a.active {
	font-weight:bold;
}