/*--------------------------------------------------------------
## Typography
--------------------------------------------------------------*/
/*--------------------------------------------------------------
### UCSC Colors
--------------------------------------------------------------*/
/*--------------------------------------------------------------
### General Colors
--------------------------------------------------------------*/
/*--------------------------------------------------------------
## Structure
--------------------------------------------------------------*/
/**
 * Font reset
 */
html {
  font-size: 62.5%; }

body {
  font-size: 1.6rem; }

p,
pre,
blockquote,
ul,
ol,
dl,
figure,
figcaption,
table,
fieldset,
details {
  font-size: 1.6rem; }

h1 {
  font-size: 3.2rem; }

h2 {
  font-size: 2.4rem; }

h3,
legend {
  font-size: 2.4rem; }

h4 {
  font-size: 1.92rem; }

h5 {
  font-size: 1.6rem; }

h6 {
  font-size: 1.4rem; }

.page-top #topNav {
  font-size: 1.44rem; }

.names .secondary-name,
.names .secondary-name > * {
  font-size: 3.6rem; }

#mainNav li,
.site-nav li {
  font-size: 1.84rem; }

@media screen and (min-width: 992px) {
  #mainNav li,
  .site-nav li {
    font-size: 2.16rem; } }
.main-footer .footer-left .address .location {
  font-size: 1.52rem; }
.main-footer .footer-left .address .copyright {
  font-size: 1.28rem; }

/**
 * Custom Styles
 */
.row.slider {
  margin-bottom: 0; }

.hero-area .text h2,
.hero-area .text p {
  margin: .2em 0;
  color: #074e84; }

#sprflt .main-content,
#sprflt .sidebar {
  float: none;
  margin: 0;
  width: 100%; }

.mid-page-banner-area {
  width: 100%;
  position: relative; }
  .mid-page-banner-area .text {
    position: absolute;
    width: 100%;
    bottom: 3.55em;
    left: 0;
    text-align: center;
    background-color: rgba(0, 0, 0, 0.35); }
    @media screen and (min-width: 48em) {
      .mid-page-banner-area .text {
        bottom: 7em; } }
    .mid-page-banner-area .text .banner-heading {
      color: #efae2f;
      font-size: 2.125rem;
      text-transform: uppercase;
      font-weight: 700;
      margin: 0; }
      @media screen and (min-width: 48em) {
        .mid-page-banner-area .text .banner-heading {
          font-size: 4.25rem; } }

.footnotes ol,
.footnotes li,
.footnotes p,
.footnotes a {
  font-size: 1.2rem; }

.sidebar-contact h3 {
  font-size: 1.6rem; }
.sidebar-contact p {
  font-size: 1.4rem; }

/**
 * Home
 */
.home-blurb {
  background-color: #007988; }
  .home-blurb .blurb-wrap {
    margin: 0 auto;
    max-width: 75%;
    padding: 30px 0; }
    .home-blurb .blurb-wrap p {
      color: #fff;
      margin: 0;
      font-size: 2rem;
      line-height: 1.5; }

/**
 * Home Grid
 */
.home-grid {
  display: grid;
  grid-template-columns: 1fr;
  grid-gap: 1em;
  list-style-type: none;
  margin: 0; }
  @media screen and (min-width: 800px) {
    .home-grid {
      grid-template-columns: 1fr 1fr 1fr;
      grid-template-rows: 1fr 1fr; } }
  .home-grid li {
    margin: 0; }
  .home-grid figure {
    text-align: center; }
    .home-grid figure figcaption {
      font-size: 1.4rem;
      font-family: 'Roboto';
      letter-spacing: 0px;
      color: #454545; }

@media screen and (min-width: 48em) {
  .hero-area.layout-left {
    width: 100%;
    max-width: 50%;
    margin: 2% 0; }

  .hero-area.layout-left {
    left: 0; }

  .color-gold {
    background-color: #f1af13; }

  .home .hero-area {
    border-bottom: #007988 15px solid; }

  .hero-area {
    width: 100%;
    bottom: 0;
    z-index: 1;
    position: relative; }
    .hero-area .text {
      position: absolute;
      bottom: 2em;
      left: 0;
      background-color: #efae2e;
      padding: 1.76rem 3.52rem;
      max-width: 26em;
      font-size: 1.76rem; }
      .hero-area .text h2,
      .hero-area .text p {
        color: #07478a;
        margin: 0 0 .25em 0; }
      .hero-area .text h2 {
        font-weight: 600;
        font-size: 2.64rem; } }
.main-navigation .current,
.main-navigation .current:focus,
.main-navigation .current:hover,
.main-navigation .current:active {
  text-decoration: none;
  border-bottom: 2px solid #CDECFF !important;
  color: #000000 !important; }

a:focus-visible {
  color: #111111 !important;
  background-color: #ffff00 !important;
  border: none !important;
  outline: 1px dotted #111111;
  text-decoration: none !important; }

.separate .inner {
  min-height: auto; }

#noflt .main-content {
  max-width: 42em; }

#content {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100vh; }

#main {
  flex-grow: 1; }

.main-content > :first-child {
  margin-top: 0;
  padding-top: 0; }

@media screen and (min-width: 48em) {
  .three.separate.flex {
    display: flex;
    justify-content: space-between; }
    .three.separate.flex .wrap {
      flex-basis: 48%;
      float: none;
      width: auto; }

  .gsc-control-cse {
    padding: 0 !important; }

  #sprflt {
    flex-direction: row-reverse; }

  #sprflt .main-content {
    width: 75%;
    margin-left: 1%; }

  #sprflt .sidebar {
    width: 24%; }

  .quote-block .inner blockquote {
    text-transform: none;
    font-size: 2.56rem;
    font-weight: 300;
    border: 0;
    padding: 0 1em; }
  .quote-block .inner span {
    font-weight: 400;
    display: block;
    text-align: right; }
  .quote-block .inner a:hover,
  .quote-block .inner a:focus,
  .quote-block .inner a:active {
    text-decoration: none;
    background-color: red; } }
@keyframes fadeIt {
  0% {
    background-color: #FFFFFF; }
  10% {
    background-color: #ffff8f; }
  100% {
    background-color: #FFFFFF; } }
:target {
  animation: fadeIt 3s ease-in-out; }

.cp-evc-search-advisory-committee table tr td:nth-child(odd) {
  width: 17vw; }

.announcements ul {
  margin: 1em 0;
  padding: 0;
  list-style: none; }

.announcements li {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  padding: 0;
  margin: .5em 0 1em 0; }
  .announcements li span {
    flex: 0 1 16ch;
    padding-right: 1em; }
  .announcements li a {
    flex: 3 0 50ch; }

.topbutton {
  text-align: center;
  height: 50px;
  width: 50px;
  position: fixed;
  right: 15px;
  bottom: 30px;
  z-index: 99999;
  background-repeat: no-repeat;
  display: none;
  border-bottom: none;
  color: #da216d; }
  .topbutton:hover, .topbutton.focus, .topbutton.active, .topbutton.visited {
    border-bottom: none;
    color: #da216d; }