*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  -webkit-text-size-adjust: 100%;
}

body{
  font: 16px/1.6 Arial, Helvetica, sans-serif;
  padding:0;
  margin:0;
  background-color:#f6f6f6;
}

img, video{
  max-width:100%;
  height:auto;
}

/* Global */
.container{
  width:92%;
  max-width:1200px;
  margin:0 auto;
}

ul{
  margin:0;
  padding:0;
}

h1, h2, h3{
  overflow-wrap:break-word;
}



/*** Homepage ***/
/* Header */
header{
  background:#58595B;
  color:#ffffff;
  padding-top:20px;
  min-height:70px;
  border-top:#ff8200 5px solid;
}

header .container{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:10px 20px;
}

header a{
  color:#ffffff;
  text-decoration:none;
  text-transform:uppercase;
  font-size:15px;
}

header ul{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
}

header li{
  display:inline;
  padding: 20px 20px 0 20px;
}

header #branding{
  text-align: center;
}

header #branding h1{
  margin:0;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:10px;
  justify-content:center;
}

header #branding img{
  height: 70px;
  max-width:100%;
}

header nav{
  margin-top:10px;
}

header .highlight, header .current a{
  color:#ff8200;
  font-weight:bold;
}

header a:hover{
  color:#ffffff;
  font-weight:bold;
}

/* Dropdown menu (Research) */
.dropbtn {
  display:inline;
  color: #ffffff;
  text-align:center;
  text-decoration:none;
}

li a:hover, .dropdown:hover .dropbtn {
  background-color: #ff8200;
}

li.dropdown {
  display:inline;
  position:relative;
}

.dropdown-content {
  display: none;
  position: absolute;
  top:100%;
  left:50%;
  transform:translateX(-50%);
  background-color: #58595B;
  min-width: 180px;
  z-index: 10;
  border-radius:0 0 4px 4px;
  overflow:hidden;
  box-shadow:0 6px 12px rgba(0,0,0,0.25);
}

.dropdown-content a{
  color: #ffffff;
  padding: 10px 14px;
  text-decoration: none;
  display: block;
  text-align: left;
}

.dropdown:hover .dropdown-content,
.dropdown:focus-within .dropdown-content {
  display: block;
}

/* Showcase */
#showcase,
#showcase_fundamental,
#showcase_space,
#showcase_air,
#showcase_ground,
#showcase_power,
#showcase_facility,
#showcase_sponsors{
  min-height:300px;
  display:flex;
  align-items:center;
  justify-content:center;
  background-repeat:no-repeat;
  background-position:center;
  background-size:cover;
  text-align:center;
  color:#ffffff;
  padding:20px 0;
}

#showcase{
  background-image:linear-gradient(rgba(0,0,0,0.5),rgba(0,0,0,0.5)),url('../img/cover_new.png');
}

#showcase_fundamental{
  background-image:linear-gradient(rgba(0,0,0,0.5),rgba(0,0,0,0.5)),url('../img/fundamental.jpg');
}

#showcase_space{
  background-image:linear-gradient(rgba(0,0,0,0.5),rgba(0,0,0,0.5)),url('../img/space.jpg');
}

#showcase_air{
  background-image:linear-gradient(rgba(0,0,0,0.5),rgba(0,0,0,0.5)),url('../img/air.jpg');
}

#showcase_ground{
  background-image:linear-gradient(rgba(0,0,0,0.5),rgba(0,0,0,0.5)),url('../img/ground.jpg');
}

#showcase_power{
  background-image:linear-gradient(rgba(0,0,0,0.5),rgba(0,0,0,0.5)),url('../img/power.png');
}

#showcase_facility{
  background-image:linear-gradient(rgba(0,0,0,0.5),rgba(0,0,0,0.5)),url('../img/facility.jpg');
}

#showcase_sponsors{
  background-image:linear-gradient(rgba(0,0,0,0.5),rgba(0,0,0,0.5)),url('../img/sponsors.jpg');
}

#showcase h1,
#showcase_fundamental h1,
#showcase_space h1,
#showcase_air h1,
#showcase_ground h1,
#showcase_power h1,
#showcase_facility h1,
#showcase_sponsors h1{
  font-size:clamp(28px, 5vw, 50px);
  margin:0 0 10px 0;
}


/* Welcome */
#welcome{
  margin-top:20px;
  margin-bottom:10px;
}

#welcome .box{
  text-align:left;
  color:#ff8200;
}

/* Boxes */
#boxes{
  margin-top:0px;
}

#boxes .container{
  display:flex;
  flex-wrap:wrap;
  gap:30px;
  align-items:flex-start;
}

#boxes .box1,
#boxes .box2{
  text-align:left;
  flex:1 1 320px;
  min-width:0;
}

#boxes .box1 li{
  margin-left:40px;
  text-indent:0px;
}

#boxes .box1 figure{
  margin:10px 0;
}

#boxes .box2 figure{
  margin:10px 0;
}

#counter{
  text-align:center;
  padding:0 4%;
}



/*** Research ***/
#main_body,
#main_body_f,
#main_body_s,
#main_body_a,
#main_body_g,
#main_body_p,
#main_body_fa,
#main_body_sp{
  margin-top:20px;
}

#main_body .box1,
#main_body_f .box1,
#main_body_f .box2{
  text-align:left;
  width:100%;
}

#main_body .box1 h2,
#main_body_f .box1 h2{
  color:#ff8200;
}

#main_body .box2 li,
#main_body_f .box2 li{
  margin-left:40px;
  text-indent:0px;
}

/* Responsive image / media grids shared across Research sub-pages */
#research_figure,
#figure_sponsor,
#figure_f,
#figure_s,
#figure_a,
#figure_g,
#figure_p,
#figure_fa,
#figure_sp{
  margin-bottom:50px;
}

#research_figure .container,
#figure_f .container,
#figure_s .container,
#figure_a .container,
#figure_g .container,
#figure_p .container,
#figure_fa .container,
#figure_sp .container{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(240px, 1fr));
  gap:20px;
  align-items:start;
}

#research_figure .box3,
#figure_f .box3,
#figure_s .box2,
#figure_a .box2,
#figure_g .box2,
#figure_p .box2,
#figure_fa .box2,
#figure_sp .box2{
  text-align:center;
  padding:10px;
  margin-top:0;
}

#research_figure .box3 img,
#figure_f .box3 img,
#figure_s .box2 img,
#figure_a .box2 img,
#figure_g .box2 img,
#figure_p .box2 img,
#figure_sp .box2 img{
  width:100%;
}

#figure_fa .box2 video{
  width:100%;
}

/* Sponsor logo grid (single .box2 containing all logos) */
#figure_sponsor .container{
  display:block;
}

#figure_sponsor .box2{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  align-items:center;
  gap:30px;
  padding:10px;
  margin-top:20px;
}

#figure_sponsor .box2 p{
  display:none;
}

#figure_sponsor .box2 img{
  width:auto;
  max-height:110px;
  flex:0 1 180px;
  object-fit:contain;
}



/*** Publications ***/
#main_body_pub{
  margin-top:20px;
  margin-bottom:50px;
}

#main_body_pub .container{
  display:flex;
  flex-wrap:wrap;
  gap:30px;
}

#main_body_pub .box1,
#main_body_pub .box2{
  text-align:left;
  flex:1 1 320px;
  min-width:0;
}

#main_body_pub .box1 li,
#main_body_pub .box2 li{
  margin-left:40px;
  text-indent:0px;
}

#main_body_pub .box1 h2,
#main_body_pub .box2 h2{
  color:#ff8200;
}



/*** Teaching ***/
#main_body_teach{
  margin-top:20px;
  margin-bottom:50px;
}

#main_body_teach .box{
  text-align:left;
}

#main_body_teach .box h2{
  color:#ff8200;
}


/*** Members ***/
#main_body_members{
  margin-top:20px;
  margin-bottom:50px;
}

#main_body_members .box{
  text-align:left;
}

#main_body_members .box h2{
  color:#ff8200;
  margin-top:40px;
}

#main_body_members .box h2:first-child{
  margin-top:0;
}

.people-grid{
  display:flex;
  flex-wrap:wrap;
  gap:24px;
  margin:15px 0 10px 0;
}

.person{
  flex:1 1 220px;
  max-width:260px;
  background:#ffffff;
  border-radius:8px;
  padding:14px;
  box-shadow:0 1px 4px rgba(0,0,0,0.12);
}

.person-photo{
  width:100%;
  aspect-ratio:1 / 1;
  object-fit:contain;
  background:#eeeeee;
  border-radius:6px;
  display:block;
  margin-bottom:10px;
}

.person p{
  margin:0;
}



/*** News ***/
#main_body_news{
  margin-top:20px;
  margin-bottom:50px;
}

#main_body_news .box{
  text-align:left;
}

#main_body_news .box li{
  margin-left:40px;
  text-indent:0px;
  padding:4px 0;
}

#main_body_news .box h2{
  color:#ff8200;
}

#main_body_news .box img{
  width:50%;
}



/*** Resume ***/
#main_body_resume{
  margin-top:20px;
  margin-bottom:50px;
}

#main_body_resume .box1,
#main_body_resume .box2,
#main_body_resume .box3,
#main_body_resume .box4{
  text-align:left;
  width:100%;
}

#main_body_resume .box1 li,
#main_body_resume .box2 li,
#main_body_resume .box3 li,
#main_body_resume .box4 li{
  margin-left:40px;
  text-indent:0px;
}

#main_body_resume .box2 h2,
#main_body_resume .box3 h2,
#main_body_resume .box4 h2{
  color:#ff8200;
}



/*** REU ***/
#main_body_reu{
  margin-top:20px;
  margin-bottom:50px;
}

#main_body_reu .box1,
#main_body_reu .box2,
#main_body_reu .box3,
#main_body_reu .box4,
#main_body_reu .box5,
#main_body_reu .box6,
#main_body_reu .box7{
  text-align:left;
  width:100%;
}

#main_body_reu .box1 li,
#main_body_reu .box2 li,
#main_body_reu .box3 li,
#main_body_reu .box4 li,
#main_body_reu .box5 li,
#main_body_reu .box6 li,
#main_body_reu .box7 li{
  margin-left:40px;
  text-indent:0px;
}

#main_body_reu .box1 h2,
#main_body_reu .box2 h2,
#main_body_reu .box3 h2,
#main_body_reu .box4 h2,
#main_body_reu .box5 h2,
#main_body_reu .box6 h2,
#main_body_reu .box7 h2{
  color:#ff8200;
}



/*** Opportunities ***/
#main_body_openings{
  margin-top:20px;
  margin-bottom:50px;
}

#main_body_openings .box{
  text-align:left;
}

#main_body_openings .box h2{
  color:#ff8200;
}


/* Main-col */
article#main-col{
  width:65%;
}

footer{
  padding:10px;
  margin-top:20px;
  color:#ffffff;
  background-color:#58595B;
  text-align: center;
  border-top:#ff8200 5px solid;
}

/* Media Queries */
@media(max-width: 900px){
  article#main-col,
  aside#sidebar{
    width:100%;
  }

  #showcase,
  #showcase_fundamental,
  #showcase_space,
  #showcase_air,
  #showcase_ground,
  #showcase_power,
  #showcase_facility,
  #showcase_sponsors{
    min-height:220px;
  }
}

@media(max-width: 768px){
  header .container{
    justify-content:center;
    text-align:center;
  }

  header nav ul{
    justify-content:center;
  }

  header li{
    padding:10px 12px 0 12px;
  }

  .dropdown-content{
    left:50%;
  }

  #newsletter h1,
  #newsletter form{
    text-align:center;
    width:100%;
  }

  header{
    padding-bottom:20px;
  }

  #newsletter form input[type="email"], .quote input, .quote textarea{
    width:100%;
    margin-bottom:5px;
  }
}

@media(max-width: 480px){
  body{
    font-size:15px;
  }

  #boxes .box1 li,
  #main_body .box2 li,
  #main_body_pub .box1 li,
  #main_body_pub .box2 li,
  #main_body_news .box li,
  #main_body_resume .box1 li,
  #main_body_resume .box2 li,
  #main_body_resume .box3 li,
  #main_body_resume .box4 li,
  #main_body_reu .box1 li,
  #main_body_reu .box2 li,
  #main_body_reu .box3 li,
  #main_body_reu .box4 li,
  #main_body_reu .box5 li,
  #main_body_reu .box6 li,
  #main_body_reu .box7 li{
    margin-left:24px;
  }

  .person{
    flex:1 1 140px;
  }
}