@import url('https://fonts.googleapis.com/css?family=Muli:300,300i,600,600i|Bitter');
html { -webkit-text-size-adjust: none; }
body { margin: 0 auto; max-width: 1024px; line-height: 1.5; padding: 0; text-align: justify; font-size: 0.85em;
  font-family: 'Muli', sans-serif; color: #202020 }
h1,h2,h3,h4 { line-height: 1.2; margin-bottom: 0; font-family: 'Bitter', serif; text-align: left; }
h1 { font-size: 2.0em; margin-top: 1.5em; }
h2 { font-size: 1.8em; margin-top: 1.5em; }
h3 { font-size: 1.4em; margin-top: 1.2em; }
h4 { font-size: 1.1em; margin-top: 1.2em; }
p { margin-top: 0.6em; margin-bottom: 0; }
tt { font-size: 1.1em; }
a:link { text-decoration:none; color: #4897d8; -webkit-transition: 0.2s; -moz-transition: 0.2s; -ms-transition: 0.2s;
  transition: 0.2s; }
a:visited { color: #4897d8; }
a:hover { color: #fa6e59; }
ul { margin-top: 0.4em; margin-bottom: 0; }
ul > ul { margin-top: 0; }
nav { margin-top: 0.8em; }
nav ul { margin: 0; padding-left: 0; list-style-type: none; }
table, th, td { border: 0px none; }
table { margin-top: 0.8em; border-collapse: collapse; width: 100%; }
th { text-align: center; color: #ffffff; background-color: #233340 }
td, th { padding: 0.5em 0.5em 0.5em 0.5em; text-align: center; vertical-align: middle; max-width: 180px; }
tr:nth-child(odd) { background-color: #f2f2f2; }
td.border-left { border-left: 3px solid #f2f2f2; }
td.border-right { border-right: 3px solid #f2f2f2; }
footer { text-align:center; margin-top:50px; padding-bottom:25px; }
footer p { margin:0; }
p.last-edited { font-size: 0.9em; font-style: italic }

section#top-panel { width: auto; padding: 1em 0 0 0; margin: 0 2em 0 2em; background-color: #233340;  }
section#top-panel div.container { margin: 0 auto; padding: 0; display: flex; justify-content: center; }
section#top-panel div.title { padding: 0; }
section#top-panel h1 { font-size: 1.4em; margin: 0; font-weight: 700; color: #ffffff; text-align: center; }
section#top-panel h2 { font-size: 1em; margin: 0.3em 0 0 0; font-weight: 400; color: #88a0b4; text-align: center; }

section#nav-panel { width: auto; padding: 2em 0 1em 0; margin: 0 2em 0 2em; background-color: #233340; }
section#nav-panel a { font-family: 'Bitter', serif; font-size: 1.2em; }
section#nav-panel a:link { color: #ffffff; }
section#nav-panel a:visited { color: #ffffff; }
section#nav-panel a:hover { color: #ffa091; }
section#nav-panel li.selected a { color: #ff7d69; }
section#nav-panel ul.nav { margin: 0; padding: 0; list-style: none; display: flex; justify-content: center;
  flex-wrap: wrap; }
section#nav-panel .nav li { margin: 0 1em 0 1em; padding: 0; }

section#main-panel { width: auto; display: grid; padding: 1.5em 0 0 0; margin: 0 2em 0 2em; }
section#main-panel .page-title { margin-top: 0; }

#about div { display: grid; }
#about #about-nav-panel img { width:163px; }
#about #about-nav-panel { float: left; margin-top: 25px; margin-right: 25px; }
#about #about-content h1 { margin-top:25px; margin-bottom:-0.2em; min-width: 225px; }
#about > div > div > p { margin: 0; }
#about > div > div { margin-top:0.8em; }
.project-item { clear: both; overflow: auto; margin-top: 1.2em; }
.project-item img { width: 150px; float: left; display: grid; margin-right: 12px; }
.project-item .project-text { display: grid; }
.project-item h2 { margin-top:0; }
.project-item p { margin-top: 0.5em; }
#teaching .offerings { margin-top: 0; }
#publications ul { list-style-type: none; padding-left: 28px; }
#publications li { position: relative; margin-top: 0.8em; }
#publications label { position: absolute; left: -50px; width: 50px; text-align: right; }
#publications p { margin: 0; }
#publications p.title { font-style: italic; }

#scrollBtn { display: none; position: fixed; bottom: 30px; right: 30px; z-index: 99; font-family: 'Muli', sans-serif;
  font-size: 1em; border: none; outline: none; background-color: #233340; color: white; cursor: pointer;
  padding: 1.2em 2em 1.2em 2em; -webkit-transition: 0.2s; -moz-transition: 0.2s; -ms-transition: 0.2s;
  transition: 0.2s; font-weight: 600; }
#scrollBtn:hover { background-color: #d45340; }

.alert {color:red;font-weight: bold;}
.strikethrough {text-decoration: line-through}

iframe { padding-top: 20px; padding-bottom: 20px; }

@media only screen and (max-width: 570px) {
  body { font-size: 0.7em; }
  h1 { font-size: 1.8em; }
  h2 { font-size: 1.6em; }
  h3 { font-size: 1.2em; }
  h4 { font-size: 0.9em; }
  section#top-panel div.title { padding: 0 1em 0 1em; }
  section#top-panel h1 { font-size: 1.2em; color: #88a0b4; }
  section#top-panel h2 { display: none; }
  section#nav-panel { padding-top: 1em; }
  table { font-size: 0.7em; }
}

a:link[target="_blank"]:after {
  content: url(http://upload.wikimedia.org/wikipedia/commons/6/64/Icon_External_Link.png);
  margin: 0 0 0 2px;
}