@font-face {
  font-family: 'IM Fell English';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: local('IM FELL English Roman'), local('IM_FELL_English_Roman'), url(../_font/IM_FELL_English_Roman.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215;
}

@font-face {
  font-family: 'Manrope Medium';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: local('Manrope Medium'), local('Manrope-medium'), url(../_font/manrope-medium.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215;
}

html {scroll-behavior: smooth; touch-action: manipulation;}
body {background-color: white; font-size: 16px; font-family: Georgia, Times, 'Times New Roman', serif; color: #333; font-display: swap;}
header {margin-block-end: 1.0em; font-family: 'IM Fell English', serif;}

h1,h2,h3 {margin: 0; padding: 0; font-weight: 500; color: #333;}
h1 {color: #031fc9; margin-block-end: -5px;}
section {margin-inline-end: 210px;}
img#mugShot {width: 200px; padding: 2px;
  /*border: 1px solid #003366;*/
  position: fixed; inset-inline-end: 5px; inset-block-start: 5px; z-index: 2;}

header h3 a {color: #333; text-decoration: none;}
header h3 a:hover {color: #031fc9; text-decoration: underline;}

li.uf {list-style-image: url(../_images/bullet_uf.png);}
li.odu {list-style-image: url(../_images/bullet_odu.png);}
li.citadel {list-style-image: url(../_images/bullet_citadel.png);}
li.oduphd {list-style-image: url(../_images/bullet_oduphd.png);}
li.drexel {list-style-image: url(../_images/bullet_drexel.png);}

ul li ul li {list-style-image: none;} /* only show icon for semesters, not courses */
a {color: #031fc9;}
nav {position: fixed; inset-inline-end: 5px; inset-block-start: 205px; text-align: center; z-index: 2;}
nav ul {list-style-type: none; width: 206px;}
nav ul#sections li {margin: 0; padding: 0; border-block-end: 1px dashed #003366;}
nav ul#sections li a {text-decoration: none; color: #031fc9; font-family: 'IM Fell English', sans-serif; font-size: 0.8em; display: block;}
nav ul#sections li a:hover {color: white; background-color: #031fc9;}
nav ul#software {list-style-type: none; width: 70%; text-align: center; padding-block-start: 20px; display: block;}
nav ul#software li {float: left;}
nav ul#software li a {border: 0; display: block;}
nav ul#software li a img {width: 50px;}
nav ul li#cv {margin-block-start: 2.0em; font-size: 2.0em; border: 0;}
nav ul li#cv a {border: 1px solid #031fc9; border-radius: 10px; background-color: rgba(255,255,255,0.8);}
em.me {font-weight: bolder; font-style: normal; color: #000099;}
em.best {font-weight: bolder; color: #FA4616;}


.forthcoming {font-style: italic;}


body section > ul {padding-inline-start: 2.0em;}
body section > ul > li {margin-block-end: 0.25em;}

#openMenu {display: none;}

/* Filtering of papers, posters, and presentations */
#ppp {margin: 1.0em 0 1.0em 0; clear: both;}
#ppp.unfiltered li:nth-child(even) {background-color: #f0f0ff; border-block-end: 1px solid #e7e7ff;}
/*
#ppp.unfiltered li:not(.hidden):nth-child(even) {background-color: #f0f0ff;border-block-end: 1px solid #e7e7ff;}
#ppp.filtered li:not(.hidden):nth-child(even) {background-color: #f0f0ff;border-block-end: 1px solid #e7e7ff;}
#ppp.filtered li:not(.hidden):nth-child(odd) {background-color: white; border: none;}
*/
#ppp a {color: #333;}
#ppp_heading {float: left; margin-inline-end: 2.0em;}
#ppp_filter {list-style-type: none; vertical-align: bottom;}
#ppp_filter li {float: left; margin-inline-end: 1.0em; padding-block-start: 0.75em; border-block-end: 1px dashed blue; font-size: 0.8em;}
#ppp_filter li.ppp_active {border-block-end: 2px solid blue;}
#ppp_filter a:hover {cursor:pointer;}
#ppp .hidden {display: none;}

/* Adapted from http://stackoverflow.com/questions/8160514/is-there-css-for-typesetting-the-latex-logo-in-html */
sub.texE {text-transform: uppercase; vertical-align: -0.5ex;  margin-inline-start: -0.1667em;  margin-inline-end: -0.125em; font-size: 1em; }

a.goToTop {display: none;}

.hide {display: none;}

h3#advisor {margin-inline-end: 200px;}

#glider img {position: fixed; width: 126px; inset-block-end: 5px; inset-inline-end: 37px; margin: 0; padding: 0; opacity: 0.9; display: none;}
#glider img:hover {opacity: 1.0;}
#screenshot {width: 200px;}
#thumbnailFrame {height: 100px; overflow: hidden;}
.otaygugel {display: none;}
#currentProjects em {font-weight: normal; font-style: italic;}
#funding li {margin: 0 1em 0em 1em;}
#students h3 {margin-top: 0.5em;}

#fall2022week2:hover {color: red; text-decoration:underline; cursor:pointer;}

#usa:hover {cursor: pointer; text-shadow: 0px 1px 2px #999;}
#usa:hover #u {color:red;}
#usa:hover #s {color: white;}
#usa:hover #a {color:blue;}

.clearfix::after {
  content: "";
  clear: both;
  display: table;
}

@media only screen and (min-width: 100px) and (max-width: 650px) {
  body {margin: 0; padding: 0.5em;}
  img#mugShot {position: relative; inset-block-start: auto; inset-inline-end: auto; margin: 0 auto; display: block; clip-path: circle(100px at center);}
  header h1, header h2, header h3 {text-align: center;}
  h1 {margin-block-start: 0.25em;}
  h2 {width: 100%; white-space: nowrap; font-size: 1.25em; margin-block-start: 10px; margin-block-end: 10px;}
  h3 {font-size: 0.8em;}
  ul, li {padding-inline-start: 0; margin-inline-start: 0; width: 100%;}
  nav {position: relative; text-align: left; inset-block-start: auto; inset-inline-end: auto;}
  
  nav ul#sections {margin: auto; padding: 0; width: 95%;}
  nav ul#sections li {background-color: white; border-block-end: 1px solid #ddd; border-inline-start: 2px solid blue; border-inline-end: 2px solid blue;}
  nav ul#sections:first-child {border-block-start: 3px double #ddd; margin-block-start: 10px;}
  nav ul#sections li a {text-decoration: none; padding: 7px 0px; font-variant: small-caps; text-align: center;}
  nav ul#sections:last-child {margin-block-end: 10px;}

  header {margin-block-end: 0;}
  header h2 {margin-block-start: 0; margin-block-end: 0;}
  a.goToTop {display: inline; margin-inline-start: 1.0em; font-size: 0.8em; color: white; background-color: blue; text-decoration: none; font-family: sans-serif; white-space: nowrap;}
  section {width: 90%;} /* If this is 95%, it breaks the pinned header */
  section ul {list-style-type: none; margin: 0.5em auto 0.5em 0.5em;}
  section ul li {margin: 0 1.0em 1.5em 1.0em; list-style-type: circle;}
  section#papersPostersAndPresentations {width: 100%;}
  section#papersPostersAndPresentations ul li {margin-inline-start: 0; margin-block-end: 0.5em; list-style-type: none;}
  section#courseworkHistory {width: 80%;}
  section#courseworkHistory ul {list-style-type: disc; margin-inline-start: 1.0em;}
  section#courseworkHistory ul ul {margin-inline-start: -2.0em;}
  section#courseworkHistory ul ul li {margin-block-end: 0;}
  
  .pinned {background: linear-gradient(to bottom, rgba(255,255,255,1) 80%, rgba(255,255,255,0) 100%); position: fixed; z-index: 3; inset-block-start: 0; width: 100%; padding-block-end: 1.5em;}
  .pinned h1, .pinned h2, .pinned h3 {font-size: 1.0em; width: 100%;}
  .pinned h2 {font-size: 0.8em;}
  .pinned h3 {font-size: 0.6em;}
  .pinned img#mugShot_cloned {position: absolute; width: 50px; height: 50px; inset-inline-start: 0px; inset-block-start: 5px; border: 1px solid #031fc9; padding: 0; clip-path: circle(25px at center);}

  .pinned img#openMenu {z-index: 99; position: absolute; width: 24px; height: 24px; inset-inline-end: 0px; inset-block-start: 5px; border: 1px solid #031fc9; padding: 0;}

  nav.vertical {position: fixed; inset-block-start: 10px; inset-inline-end: 5px; z-index: 100;}
  nav.vertical li {transform: rotate(90deg); position: relative; clear: both; float: left; width: 115px; display: block; font-size: 1.0em; height: 115px; }
  nav.vertical li a {height: 2.0em;}
  nav.vertical ul#sections li {background-color: transparent; text-align: center;}
  nav.vertical ul#sections:first-child {padding-inline-start: 100px;}
  section {position: relative; z-index: 2;}
  nav ul li#cv {font-size: 1.0em; margin-block-start: 1.0em; border: 0; text-align: center;}
  nav ul li#cv a {padding-inline-start: 1.0em;}
  nav ul li#cv a:before{content: '⤓ DOWNLOAD ';}
  nav ul li#cv {border: 1px solid #031fc9; border-radius: 10px; background-color: inherit;}
  #ppp {margin: 0;}
  #ppp_filter {width: 100%;}
  #ppp_filter li {padding: 0; margin: 0 0 0.5em 0; border: 1px solid white; width: 19%; text-align: center; height: 3.5em; display: inline-block; border-block-end: 2px solid #ccccff; vertical-align: bottom;}
  #ppp_filter li.ppp_active {background-color: #eee;}
  #ppp_filter li a {padding: 1.0em 0 0 0; height: 100%; width: 100%; display: inline-block;}
  #ppp_filter li:hover:not(.ppp_active) {border: 1px dotted blue;}
  header#originalHeader h3#advisor {margin-inline-end: auto;}
  header#originalHeader h3#advisor span {display: block; color: transparent; clear: both; height: 0px;}

  li.uf, li.odu, li.citadel, li.oduphd, li.drexel {list-style-image: none;}
  body section > ul { padding: 0;}
  em.best {white-space: nowrap;}

  #hamburger {width: 35px; height: 5px; background-color: black; margin: 6px 0; position: absolute;}
}

@media only screen and (min-width: 100px) and (max-width: 1130px) {
  #ppp_filter {clear: both;}
}

@media (prefers-color-scheme: dark) {
    body {
        background-color: #111;
        color: white;
    }
    a {color: #FA4616;}
    h1, h2, h3 {color: #ddd;}
    #ppp_filter li {border-block-end: 1px dashed #FA4616;}
    #ppp_filter li.ppp_active {border-block-end: 2px solid #FA4616;}
    #ppp.unfiltered li:nth-child(even) {background-color: #222; border-block-end: none;}
    
    header h3 a {color: inherit; text-decoration: none;}
    header h3 a:hover {color: #FA4616; text-decoration: underline;}
    
    nav ul#sections li a {color: #FA4616; padding-inline-start: 0.5em;}
    nav ul#sections li a:hover {color: white; background-color: #FA4616;}
    nav ul#sections li {border-block-end: 1px dashed #FA4616;}
    nav ul li#cv {border-block-end: none; background-color: inherit;}
    nav ul li#cv a {border: 1px solid #FA4616; background-color: white;}
    #ppp a {color: #FA4616;}
    em.me {font-weight: bolder; font-style: normal; color: #FA4616;}
    
    img#mugShot {border: 1px solid #FA4616;}
    
    em.best {color: #0021A5; font-style: normal; text-shadow: 0px 0px 3px white;}
    
    #ppp_filter li:hover:not(.ppp_active) {border: 1px dotted #FA4616;}

    li.oduphd {list-style-image: url(../_images/bullet_oduphd_dark.png);}
    li.drexel {list-style-image: url(../_images/bullet_drexel_dark.png);}
}

@media only screen and (min-width: 100px) and (max-width: 650px) and (prefers-color-scheme: dark) {
 .pinned {background: linear-gradient(to bottom, rgb(33,33,33,1) 80%, rgba(255,255,255,0) 100%); position: fixed; z-index: 3; inset-block-start: 0; width: 100%; padding-block-end: 1.5em;}
 nav ul#sections li {background-color: transparent;}
 nav ul li#cv {background-color: white; border: none;}
 nav ul#sections:first-child {border-block-start: 1px dashed #FA4616;}
 
}

@media only screen and (min-width: 100px) and (max-width: 650px) {
  #glider {display: none;}
}