/* ---- Background ------------------------------------------- */
body 
{
   font-family: PT Serif;
   font-size: 100%; /* Default font size is 16px */
   background-image: url("../img/background.png");
   background-repeat: repeat-x;
   background-color: #111;
}
#wrapper 
{
   max-width: 68.75em;
   margin-left: auto;
   margin-right: auto;
}
/* ---- Text ------------------------------------------- */
/* Note: headings are placed in the section that they are found in the .html files (see below) */
p 
{
   font-size: 0.875em;
   text-align: justify;
   margin: 0 1.42857143em;
}
blockquote 
{
   font-size: 0.875em;
   margin: 0.3125em 0 0.3125em 2.85714286em;
}
#content .tabulated
{
   font-size: 0.875em;
   border-collapse: collapse;
   margin: 0 1.42857143em;
}
#content .tabulated td:nth-child(odd)
{
   padding: 0.125em 1.42857143em 0.125em 0;
}
#content .tabulated tr:nth-child(odd)
{
   background-color: #F4F4F4;
}
.deemphasized {font-size:0.75em; padding-top:2em;} /* For "Back to top" link */
/* ---- Images ------------------------------------------- */
#gallery {margin:0 1.25em;}
#gallery img {border-radius:0.125em;}
#gallery a:hover, #gallery a:active, #image a:hover, #image a:active {opacity:0.5; filter:alpha(opacity=50);} /* Hover effect */
#image {margin:0 1.25em; /*float:right;*/} /* Images placed next to blocks of text */
#image img {width:100%; border-radius:0.125em;}
/* ---- Links ------------------------------------------- */
a 
{
   -webkit-transition: color 0.25s;
   -moz-transition: color 0.25s;
   -o-transition: color 0.25s;
   transition:color 0.25s;
}
a.link:link {color:#536895; text-decoration:none;}
a.link:visited {color:#536895; text-decoration:none;}
a.link:hover {color:#000; text-decoration:none;}
a.link:active {color:#536895; text-decoration:none;}
/* ---- Header ------------------------------------------- */
header 
{
   width: 100%;
   margin: 1.5625em 0 0;
   border-top-left-radius: 0.25em;
   border-top-right-radius: 0.25em;
   background: -moz-linear-gradient(left, #50699C, #0F141C); /* FF3.6+ */
   background: -webkit-gradient(linear, top left, top right, color-stop(#50699C), color-stop(#0F141C)); /* Chrome,Safari4+ */
   background: -webkit-linear-gradient(left, #50699C,#0F141C); /* Chrome10+,Safari5.1+ */
   background: -o-linear-gradient(left, #50699C,#0F141C); /* Opera 11.10+ */
   background: -ms-linear-gradient(left, #50699C,#0F141C); /* IE10+ */
   background: linear-gradient(to right, #50699C,#0F141C); /* W3C */
   filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#50699C', endColorstr='#0F141C',GradientType=0 ); /* IE6-9 */
}
h1
{
   font-family: Source Sans Pro;
   color: #fff; 
   font-size: 2.5em;
   font-weight: 400;
   line-height: 0;
   padding: 0.25em 0 1em 0.625em;
   margin: 0;
}
header .logo 
{
   width: 33%;
   max-width: 18.75em;
   padding: 1.25em 0 0 1.5625em;
   margin: 0;
}
header table {border-collapse:collapse;}
/* ---- Navigation Bar ------------------------------------------- */
.toggle {display:none;}
#navbar
{
   height: 1.9375em;
   padding: 0;
   margin: 0 0 1.25em;
   background-color: #FEBB36;
   border-bottom-left-radius: 0.25em;
   border-bottom-right-radius: 0.25em;
}
#navbar ul
{
   list-style-type: none;
   overflow: hidden; 
   padding: 0;
   margin: 0;
}
#navbar a 
{
   font-family: helvetica;
   font-size: 0.75em;
   font-weight: bold;
   color: #000;
   text-decoration: none;
   text-transform: uppercase;
   text-align: center;
   display: block;
   padding: 0.666667em 1.666667em;
   border-bottom-left-radius: 0.333333em;
   border-bottom-right-radius: 0.333333em;
   -webkit-transition: background-color ease 0.25s;
   -moz-transition: background-color ease 0.25s;
   -o-transition: background-color ease 0.25s;
   transition: background-color ease 0.25s;
}
#navbar a:link,#navbar a:visited {background-color: #FEBB36;}
#navbar .left a:hover,#navbar .left a:active {background-color: #FFD887;}
#navbar .right a:hover,#navbar .right a:active {background-color: #E4A832;}
#navbar .left li {float:left;}
#navbar .right li {float:right;}
#navbar .left, #navbar .right ul, #navbar .right li {display:inline;}
.button {display:none;}
/* ---- Side Bar ------------------------------------------- */
#sidebar 
{
   float: left;
   font-family: helvetica;
   font-size: 0.75em;
   width: 23.3333333em;
}
#sidebar ul
{
   list-style-type: none;
   overflow: hidden;
   border-radius: 0.3333333em;
   border-style: solid;
   border-width: 0.08333333em;
   border-color: #1A1A1A;
   background-color: #fff;
   margin: 0;
}
#sidebar ul.contents {padding:0 0 0.8333333em; margin:0 0 1.6666667em;}
#sidebar .contents a 
{
   font-weight: bold;
   line-height: 2;
   display: block;
   width: 100%;
   padding: 0.41666667em 0 0.41666667em 0.83333333em;
   -webkit-transition: all ease 0.25s;
   -moz-transition: all ease 0.25s;
   -o-transition: all ease 0.25s;
   transition: all ease 0.25s;
}
#sidebar .contents a:hover {background-color:#EEEEEE;}
#sidebar ul.news {padding:0 0 0.8333333em;}
#sidebar .news table {border-collapse:collapse; border-radius:0.3333333em;}
#sidebar .news th, #sidebar .news td
{
   text-align: left;
   vertical-align: center;
   padding: 0.8333333em 0;
}
#sidebar .news th 
{
   width: 3.3333333em; 
   padding: 0 0.6666666667em;
   text-align: center;
}
#sidebar .news td {padding-right:0.8333333em;}
#sidebar .news tr {border-top:0.08333333em dotted #CDCDCD;}
#sidebar li.heading
{
   font-family: PT Serif;
   font-size: 1em;
   text-transform: uppercase;
   font-weight: 700;
   padding: 1.25em 0 0.833333em 0.833333em;
}
/* ---- Content ------------------------------------------- */
#fluid_wrapper 
{
   float: left;
   width: 100%;
   margin-right: -17.5em;
}
#content 
{
   margin-right: 18.75em;
   background-color: #FDFDFD;
   padding: 0.9375em 0 1.875em;
   border-style: solid;
   border-width: 0.0625em;
   border-color: #1A1A1A;
   border-radius: 0.25em;
}
h2 /* Main headings */
{
   font-weight: 700;
   font-size: 1.5em;   
   line-height: 0.5;
   color: #536895;
   padding: 0.625em 0 0.4166666em 0.8333333em;
   margin: 0;
}
h3 /* Sub headings */
{
   font-weight: 700;
   font-size: 1.25em;
   line-height: 1;
   padding: 0.5em 0 0.5em 1em;
   margin: 0;
}
/* ---- Home and Research Page Content ------------------------------------------- */
.list
{
   font-size: 0.875em;
   text-align: left;
   padding: 1em 4.28571429em;
   margin: 0;
}
/* ---- Members Page Content ------------------------------------------- */
#portrait 
{
   width: 7.5em; 
   height: 9.375em;
   padding-left: 1.25em;
   float: right;
}
#portrait img
{
   width: 6em;
   border-radius: 0.15em;
}
#fluid_wrapper_small
{
   width: 100%;
   float: right;
   margin-left: -8.75em;
}
#biography
{
   margin-left: 8.75em;
   height: 9.375em;
   float: left;
   padding-right: 1.25em;
}
#biography p {padding:0;}
#biography .name {font-weight:700;}
#biography table {border-collapse:collapse; margin-left:1.25em;}
#biography th, #biography td {padding:0;}
#biography table img.icon 
{
   width: 1.375em;
   padding: 0.625em 0.25em 0 0;
}
.tooltip {display:inline; position:relative;}
.tooltip span {display:none;}
.tooltip:hover span /* tooltip appears on hover */
{
   display: block;
   position: absolute; 
   padding: 0;
   content: attr(title);
   color: #E6E6E6;
   white-space: nowrap;
   font-size: 0.75em;
   padding: 0.3333333em 1em;
   background: #262626;
   -moz-border-radius: 0.2em;
   -webkit-border-radius: 0.1666667em;
   border-radius: 0.1666667em;
   top: 2.5em; 
   left: -0.6666667em;
}
.tooltip:hover span:after /* triangle */
{
   position: absolute;
   display: block;
   content: "";
   height: 0;
   width: 0;
   border-color: transparent transparent #262626 transparent;
   border-style: solid;
   border-width: 0.8333333em 0.75em;
   top: -1.5em;
   left: 0.6666667em;
}
/* ---- Publications Page Content ------------------------------------------- */
h6 /* For paper titles */
{
   color: #536895;
   font-size: 0.875em;
   margin: 0 1.42857143em;
}
/* ---- Related Links Content ------------------------------------------- */
.table 
{
   font-size: 0.875em;
   text-align: left;
   width: 94%;
   margin: 0 1.42857143em;
   border-collapse: collapse; 
}
.table td {padding-right:1em;}
.table tr:nth-child(even) {background-color:#F5F5F5;}
/* ---- Not Found (404) Page ------------------------------------------- */
.notfound
{
   text-align: center;
   width: 100%;
   background: url("../img/nan.png");
   background-repeat: repeat;
   overflow: hidden;
}
.notfound p 
{
   font-size: 1em;
   text-align: center;
   padding-bottom: 1.5em;
}
.emphasized 
{
   color: #536895;
   font-size: 2em;
   font-weight: 700;
   text-align: center;
   text-transform: uppercase;
}
.notfound a
{
   font-size: 1em;
   text-transform: uppercase;
   background: #E4E4E4;
   padding: 0.1em 0.5em; 
   border-radius: 0.2em;
   -webkit-transition: all ease-out 0.15s;
   -moz-transition: all ease-out 0.15s;
   -o-transition: all ease-out 0.15s;
   transition: all ease-out 0.15s;
}
.notfound a:hover {background:#C4C4C4;}
/* ---- Footer ------------------------------------------- */
footer
{
   float: left;
   width: 100%;
   font-size: 0.6875em;
   text-align: center;
   color: #5D5D5D;
   margin: 0.90909091em 0;
}
/* -------------------------------------------------------------------- */
/* ---- Responsive Behavior ------------------------------------------- */
@media screen and (max-width: 900px) /* Hide sidebar and background image, resize content area, and move news to footer */
{
   body {background-image:none;}
   #fluid_wrapper, #content {margin:0;}
   #navbar, #content, #sidebar {border:0;}
   #sidebar .contents {display:none;}
   #sidebar, #sidebar ul, #sidebar .news table {width:100%;}
   #sidebar .news th {padding: 0.4166667em 1em 0.4166667em 1.5em;}
   #sidebar .news
   {
      background-color: #2E2E2E;
      color: #BFBFBF;
      clear: both;
      width: 100%;
      margin: 0.8333333em 0 0;
   }
   #sidebar .news tr {border-top:0.08333333em dotted #575757;}
   #sidebar .news li:first-child {text-align:center; margin:0.16666667em 0 0.83333333em;}
}
@media screen and (max-width: 750px) /* Compress navbar and fit content sections together */
{
   #navbar ul.right li:first-child {display:none;}
   #navbar a {padding: 0.83333333em 1em;}
   #navbar ul.left li:first-child {padding-left:0.625em;}
   #navbar ul.right li {padding-right:0.625em;}
   #navbar {height:2.1875em;}
   body, header, #navbar, #content, #sidebar .news {margin:0;}
   header, #navbar, #content, #sidebar .news {border-radius:0;}
}
@media screen and (max-width: 600px) /* Change navbar to a slide out menu, compress header, fix header position, reduce margins, and resize Members page content */
{  
   /* Create slide-out navigation bar */
   /* Note that some visual settings can only be changed in "jquery.pageslide.css" */ 
   .toggle
   {
      display: block;
      width: auto;
      margin-right: 1.3em;
   }
   #navbar {display:none;}
   #navbar ul.right li:first-child {display:block;}
   #navbar .left li, #navbar .right li {clear:both;}
   #navbar ul.left li:first-child {padding-left:0;}
   #navbar ul.right li {padding-right:0;}
   #navbar .left, #navbar .right ul, #navbar .right li {display:block;}
   #navbar li {width:100%;}
   #navbar ul {padding:0.9375em 0;}
   #navbar ul.left {background-color:#313131;}
   #navbar a 
   {
      color: #DFDFDF;
      text-align: left;
      padding: 0;
      padding: 0.6666667em 1.6666667em;
      border-radius: 0;
   }
   #navbar .left a:link, #navbar .left a:visited {background-color:#313131;}
   #navbar .left a:hover, #navbar .left a:active {background-color:#4C4C4C;}
   #navbar .right a:link, #navbar .right a:visited {background-color:#1A1A1A;}
   #navbar .right a:hover, #navbar .right a:active {background-color:#313131;}
   /* ---- Fix header ---- */
   header {position:fixed;}
   #content {padding-top:6.25em;}
   header {border-bottom: 0.3125em solid #FEBB36; z-index:98;}
   header table {padding:0; margin:0 0 0 1.3em;}
   h1 {font-size:2em; padding:0.25em 0 0.6875em;}
   header .logo {width:28%; padding:0.25em 0 0;}
   /* ---- Reduce margins ---- */
   p, h6, .table {margin:0 0.71428571em;}
   blockquote {margin:0 2.14285714em;}
   .list {padding-left:2.85714286em;}
   h2 {padding-left:0.4166667em;}
   h3 {padding-left:0.5em;}
   /* ---- Resize Members page content ---- */
   #portrait img {width:5.75em;}
   #portrait {width:6.9375em;padding-left:0.625em;}
   #fluid_wrapper_small {margin-left:-7.5625em;} 
   #biography {margin-left:7.5625em; padding-right:0.625em;}
   #biography table {margin-left:0.625em;}
}
@media screen and (max-width: 510px) /* Resize the header and menu toggle, resize the navigation bar, and reduce thumbnail size */
{
   h1 {font-size:1.5em; padding-top:0.1666667em; padding-bottom:0.75em;}
   .toggle img {width:85%;}
   #content {padding-top:5em;}
   #gallery img {width:7.5em;}
   h2 {font-size:1.3em;}
   h3 {font-size:1.1em;}
   /* ---- Resize navigation bar ---- */

   /* ---- Resize Members page content ---- */
   #portrait {width:6.25em; height:10.9375em; padding-left:0.625em;}
   #fluid_wrapper_small {margin-left:-6.875em;} 
   #biography {margin-left:6.875em; height: 10.9375em; padding-right:0.625em;}
   #biography table {margin-left:0.625em;}
}
@media screen and (max-width: 410px) /* Resize the header and menu toggle and reduce thumbnail size */
{
   h1 {font-size:1.3em; padding-bottom: 0.72115385em;}
   .toggle img {width:70%; margin-right:1em;}
   header table {margin-left:1em;}
   #gallery img {width:6.25em;}
   #content {padding-top:4.375em;}
   /* ---- Resize Members page content ---- */
   #portrait {height:12.5em;}
   #biography {height: 12.5em;}
}
@media screen and (max-width: 350px)
{
   header img {width:22%;}
   h1 {font-size:1.1em; padding-top:0;}
   #content {padding-top:3.4375em;}
   /* ---- Resize Members page content ---- */
   #portrait {height:14.0625em;}
   #biography {height: 14.0625em;}
}
@media screen and (max-width: 300px)
{
   header img {width:20%;}
   h1 {font-size: 0.9em;}
   header table {margin-left:0.8em;}
}