/* ----- Global ----- */

:root {
  --white: #fff;
  --very-light-grey: #e7e7e7;
  --light-grey: #ccc;
  --grey: #999;
  --dark-grey: #333;
  --blue:#064d83;
  --light-blue:#156ca9;
  --very-light-blue: #ceecf4;
  --link: #118ac0;
  --green:  #00b730;
  --red: #ff0000;
  }

html {
  line-height: 1.2;
  }

* {
  box-sizing: border-box;
  }

body {
  background: var(--blue);
  font-family: 'Mulish', Verdana, Arial, Helvetica, sans-serif;
  font-size: 0.8em;
  line-height: 1.5em;
  }

@media only screen and (min-width: 960px) {
  body {
    font-size: 1.1em;
    }
  }

body.cke_editable {
  background-color: var(--white);
  }

img {
  display: block;
  max-width: 100%;
  height: auto;
  }

.breadcrumb {
  padding: 7px 0;
  font-size: 0.75em;
  color: var(--grey);
  }

.breadcrumb a {
  color: var(--link);
  text-decoration: underline;
  }

.mobile-display {
  display: block;
  }

.desktop-display {
  display: none;
  }

@media only screen and (min-width: 960px) {
  .mobile-display {
    display: none;
    }
  .desktop-display {
    display: block;
    }
  }

footer.author-date {
  margin-bottom: 1em;
  }

.author {
  font-weight: 600;
  }

.date {
  font-size: 0.9em;
  color: var(--grey);
  margin-bottom: 1em;
  }

.top-border-dk-grey {
  border-top: 1px solid var(--dark-grey);
  }

.center {
  text-align: center;
  }

.remote-video-colorbox-launch-modal {
  cursor: pointer;
  position: relative;
  }

.remote-video-colorbox-launch-modal:before {
  position:absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  content: url(../images/play-arrow.png);
  font-size: 100px;
  color: var(--white);
  opacity: 1;
  }

.remote-video-colorbox-launch-modal img {
  border: 1px solid var(--grey);
  }

.white-text {
  color: var(--white);
  }


/* ----- Layout ----- */

.inner {
  display: block;
  margin: 0 auto;
  overflow: hidden;
  padding: 0;
  position: relative;
  width: 90%;
  max-width: 1400px;
  }

/* LB layout sections and styles in lb.css */


/* ----- Fonts ----- */

a {
  text-decoration: none;
  outline: none;
  color: var(--link)
  }

#content-area a:hover {
  text-decoration: underline;
  }

em {
  font-style: italic;
  }

/* p */

p.white {
  color: var(--white);
  }

h1,
.h1 {
  font-family: 'Mulish', Verdana, Arial, Helvetica, sans-serif;
  font-size: 2.5em;
  font-weight: 700;
  letter-spacing: 0.02em;
  line-height: 1.2em;
  margin: 0 0 0.5em 0;
  }

h2,
.h2 {
  font-family: 'Mulish', Verdana, Arial, Helvetica, sans-serif;
  color: var(--blue);
  font-size: 2em;
  font-weight: 800;
  letter-spacing: 0.02em;
  line-height: 1.2em;
  margin: 0 0 0.5em 0;
  }

h2 a:hover,
.h2 a:hover {
  text-decoration: none;
  }

.layout__region h2 {
  padding: 0;
  }

h3 {
  font-family: 'Mulish', Verdana, Arial, Helvetica, sans-serif;
  font-size: 1.5em;
  font-weight: 800;
  letter-spacing: 0.02em;
  line-height: 1.2em;
  margin: 0 0 0.5em 0;
  }

h4 {
  font-family: 'Mulish', Verdana, Arial, Helvetica, sans-serif;
  color: var(--blue);
  font-size: 1.2em;
  font-weight: 700;
  letter-spacing: 0.02em;
  line-height: 1.2;
  margin: 0 0 0.5em 0;
  }

.margin-bottom-less { /* for use in Views which strips inline styles */
  margin: 0 0 0.2em 0;
  }

.caption {
  font-size: 0.9em;
  }

.image-title {
  font-weight: 600;
  }

sup {
  vertical-align: super;
  font-size: smaller;
  }

sub {
  vertical-align: sub;
  font-size: smaller;
  }

a .button-blue,
a.button-blue,
.button-navy a {
  font-weight: 600;
  color: var(--white);
  text-decoration: none;
  background-color: var(--blue);
  display: inline-block;
  padding: 0.5em 1em;
  border-radius: 9999px;
  }

  a:hover .button-blue,
  a:hover.button-blue,
  .button-blue a:hover {
    color: var(--blue);
    background-color: var(--white);
    transition: background-color 0.2s;
    }

a .button-link-blue,
a.button-link-blue,
.button-link-blue a {
  font-weight: 600;
  color: var(--white);
  text-decoration: none;
  background-color: var(--link);
  display: inline-block;
  padding: 0.5em 1em;
  border-radius: 9999px;
  }

  a:hover .button-link-blue,
  a:hover.button-link-blue,
  .button-link-blue a:hover {
    color: var(--link);
    background-color: var(--white);
    transition: background-color 0.2s;
    }

a .button-white,
a.button-white,
.button-white a {
    font-weight: 600;
    color: var(--blue);
    text-decoration: none;
    background-color: var(--white);
    display: inline-block;
    padding: 0.5em 1em;
    border-radius: 9999px;
    }


/* ----- Lists ----- */

#main ul {
  list-style: square outside;
  margin-left: 1em;
  margin-bottom: 1em;
  }

#main ol {
  list-style: decimal outside;
  margin-left: 2em;
  margin-bottom: 1em;
  }

#main li {
  margin-bottom: 0.5em;
  }

.flexgrid {
  text-align: center;
  }

.flexgrid.col-5 a {
  width: 100%;
  display: block;
  margin: 1em;
  text-decoration: none;
  }

.flexgrid {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-flow: row wrap;
    flex-flow: row wrap;
  -ms-flex-pack: justify;
    justify-content: center;
  align-items: flex-start;
  }
  .flexgrid.col-5 a {
    width: 11em;
    margin: 1.2em;
    }

#main ul.flexgrid { /* no indent for albums */
  margin: 0;
  }

.flexgrid > li {
  width: 235px;
  padding: 15px 30px;
  }

.grid-page {
  text-align: center;
  }

.grid-image {
  width: 80%;
  margin: 0 auto;
  }

  @media only screen and (min-width: 600px) {
  .grid-page {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap;
    -ms-flex-pack: justify;
    justify-content: center;
    align-items: flex-start;
    text-align: center;
    }
  .grid-image {
    width: 100%;
    }
  .grid-page .views-row {
    width: 360px;
    padding: 20px;
    }
  }

#main .flexgrid {
  list-style: none;
  }

#main .flexgrid li {
  text-indent: 0;
  }

.views-field-created {
  color: var(--grey);
  margin: 0 0 1em;
  }

.layout__50 .flexgrid li {
  width: 50%;
  }


/* ----- Global Region ----- */

#global {
  overflow: visible;
  background-color: var(--blue);
  }

#global .inner {
  padding: 10px 0;
  overflow: visible;
  }

.global-section {
  display: flex;
  justify-content: space-between;
  align-items: center;
  }

.block-global-logo {
  width: 200px;
  }

body #global a {
  vertical-align: middle;
  }

.global-menu {
  display: none;
  }

  @media only screen and (min-width: 1250px) {
  .global-menu {
    display: block;
    }
  }

#superfish-global-menu {
  font-family: 'Lato', Verdana, sans-serif;
  font-size: 0.8em;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  }

#superfish-global-menu > li {
  display: inline-block;
  line-height: 1.2;
  padding: 0;
  }

.sf-menu li > ul {
  background-color: var(--dark-grey);
  }

#superfish-global-menu ul.menu li {
  margin-left: 0;
  }

#superfish-global-menu a.sf-depth-2,
#superfish-global-menu .sf-depth-2.nolink {
  background-color: var(--link);
  }

#superfish-global-menu .sf-multicolumn {
  top: 35px;
  right: 0px !important;
  }

#superfish-global-menu .sf-depth-2.sf-multicolumn-column {
  width: 50% !important;
  }

#superfish-global-menu li a,
#superfish-global-menu li.sf-no-children {
  color: var(--grey);
  padding: 10px 15px;
  }

#superfish-global-menu li a.active {
  color: var(--white);
  background-color: var(--link);
  }

#superfish-global-menu li a:hover {
  color: var(--white);
  background-color: var(--link);
  text-decoration: none;
  }

#superfish-global-menu li ul li a {
  color: var(--white);
  padding: 10px 15px;
  }

#block-responsivemenumobileicon {
  font: 'Lato', Verdana, sans-serif;
  font-weight: 700;
  letter-spacing: 0.1em;
  cursor: pointer;
  }

.responsive-menu-toggle-icon::before,
.responsive-menu-toggle-icon::after,
.responsive-menu-toggle-icon span.icon {
  background: var(--light-grey);
  }

.responsive-menu-toggle-icon span.label {
  display: none;
  }

  @media only screen and (min-width: 960px) {
    .responsive-menu-toggle-wrapper.responsive-menu-toggle {
      display: inline-block;
      }
    }

  @media only screen and (min-width: 1250px) {
    #block-responsivemenumobileicon {
      display: none;
      }
    .responsive-menu-toggle-wrapper.responsive-menu-toggle {
      display: none;
      }
    #block-mainnavigation {
      display: block;
      }
    }


/* ----- Header ----- */

#header {
  overflow: visible;
  background-color: var(--very-light-grey);
  }

#header .inner {
  padding: 15px 0;
  overflow: visible;
  }

.header-section {
  display: flex;
  justify-content: space-between;
  align-items: center;
  }

#block-rye-site-branding {
  max-width: 40%;
  width: 500px;
  display: flex;
  align-items: center;
  gap: 1em;
  }

#block-rye-site-branding .site-logo {
  flex: 1;
  }

#block-rye-site-branding .site-logo img {
  width: 100%;
  }

#block-rye-site-branding .site-name {
  font-family: 'Mulish', Verdana, Arial, Helvetica, sans-serif;
  flex: 5;
  font-weight: 600;
  letter-spacing: 0.05em;
  }

#block-mainnavigation {
  display: none;
  }

#block-horizontalmenu { /*default desktop menu component */
  display: none;
  }

#block-responsivemenumobileicon {
  font: 'Lato', Verdana, sans-serif;
  font-weight: 700;
  letter-spacing: 0.1em;
  cursor: pointer;
  }

.responsive-menu-toggle-icon::before,
.responsive-menu-toggle-icon::after,
.responsive-menu-toggle-icon span.icon {
    background: var(--link);
  }

.responsive-menu-toggle-icon span.label {
    display: none;
  }


@media only screen and (min-width: 1000px) {
  #block-responsivemenumobileicon {
    display: none;
    }
  #block-mainnavigation {
    display: block;
    }
  }

#superfish-main {
  font-family: 'Lato', Verdana, sans-serif;
  font-size: 0.8em;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  }

#superfish-main > li {
  display: inline-block;
  line-height: 1.2;
  padding: 0;
  }

.sf-menu li > ul {
  background-color: var(--dark-grey);
  }

#superfish-main ul.menu li {
  margin-left: 0;
  }

#superfish-main a.sf-depth-2,
#superfish-main .sf-depth-2.nolink {
  background-color: var(--blue);
  }

#superfish-main .sf-multicolumn {
  top: 35px;
  right: 0px !important;
  }

#superfish-main .sf-depth-2.sf-multicolumn-column {
  width: 50% !important;
  }

#superfish-main li a,
#superfish-main li .nolink {
  color: var(--link);
  padding: 10px 15px;
  }

#superfish-main li a.active {
  color: var(--white);
  background-color: var(--blue);
  }

#superfish-main li a:hover {
  color: var(--white);
  background-color: var(--link);
  text-decoration: none;
  }

  #superfish-main li ul li a {
  color: var(--white);
  padding: 10px 15px;
  }


/* ----- Alert ----- */

#alert {
  background-image: linear-gradient(to right top, #118ac0, #2299d0, #2fa7df, #3bb7ef, #46c6ff);
  padding: 20px;

  }

#alert h1,
#alert h2,
#alert h3,
#alert h4,
#alert h5,
#alert p {
  color: var(--white);
  }


.alert-link {
  color: var(--white);
  font-size: 1.2em;
  font-weight: 600;
  letter-spacing: 0.05em;
  text-align: center;
  padding: 1em;
  }

#alert ul {
  list-style: square outside;
  margin-left: 1em;
  margin-bottom: 1em;
  }


/* ----- Banner ----- */

.flexslider {
  margin: 0;
  background: var(--white);
  border: none;
  position: relative;
  zoom: 1;
  /* overrides */
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
  -webkit-box-shadow: '' 0;
  -moz-box-shadow: '' 0;
  -o-box-shadow: '' 0;
  box-shadow: '' 0;
  }

.banner img {
  display: block;
  }

#banner {
  background-position: center center;
  background-color: var(--white);
  padding-bottom: 0;
  position: relative;
  }

#banner > div {
  background: transparent;
  background-image: linear-gradient(rgba(0,0,0,0),rgba(0,0,0,0.1),rgba(0,0,0,0.3));
  }

#banner .banner-text {
  color: var(--white);
  position: relative;
  text-align: left;
  width: 90%;
  max-width: 1400px;
  margin: 0 auto;
  z-index: 10;
  text-shadow: 2px 2px 4px #333;
  min-height: 400px;
  padding: 2em 0;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: center;
  }

#banner .hero-title {
  font-family: 'Montserrat', Verdana, Arial, Helvetica, sans-serif;
  color: var(--white);
  font-size: 1.5em;
  line-height: initial;
  font-weight: 300;
  letter-spacing: 0.05em;
  }


/* ----- Administration ----- */

#admin {
  background: var(--white);
  }


/* ----- Content ----- */

#main {
  line-height: 1.5em;
  background: var(--white);
  }

#main .inner {
  padding: 2em 0;
  }

.page-node-type-advanced_page #main .inner {
  padding: 0;
  }

#block-rye-content {
  background-color: var(--white);
  }


#main .views-element-container ul {
    list-style: none;
    margin: 0;
    }

.accordion-paragraph,
.paragraph-set {
  margin: 0 0 1em 0;
  }

.accordion-title.ui-state-active,
.paragraph-set .accordion-title.ui-state-active {
  background: var(--blue);
  border: none;
  }

.ui-accordion .ui-widget-content a {
  text-decoration: none;
  outline: none;
  color: var(--link);
  }

.ui-accordion .ui-widget-content a:hover {
  text-decoration: underline;
  }

a[data-entity-type="file"] { /* file upload icon */
  background: transparent center left no-repeat url(/core/themes/classy/images/icons/text-plain.png);
  padding-left: 1.2em;
  margin-left: .3em;
  }

.spv-popup-content {
  display: none;
  position: fixed;
  background-color: rgba(0,0,0,0.6);
  z-index: 99999;
  left: 0;
  top: 0;
  bottom: 0;
  overflow-y: scroll;
  overflow-x: hidden;
  width: auto;
  }

.spv-inside-popup {
  background-color: var(--white);
  width: 70%;
  margin: 20% auto;
  padding: 2em;
  }

.spv-speaker-popup {
  display: block;
  text-align: left;
  }

.spv_close {
  cursor: pointer;
  font-size: 3em;
  padding: 0.2em 0.7em;
  color: var(--white);
  position: absolute;
  background: transparent;
  top: 5%;
  right: 5%;
  }

#main .view-fellowship-class li {
  margin: 0 0 2em;
  padding: 2em;
  background: var(--very-light-grey);
  }

.view-fellowship-class-fellow {
  font-family: 'Mulish', Verdana, Arial, Helvetica, sans-serif;
  }

.view-fellowship-class .col1,
.view-record {
  margin-bottom: 1em;
  }

@media only screen and (min-width: 40em) {
  .view-fellowship-class-fellow,
  .view-record {
    display: flex;
    gap: 2em;
    }
  .view-fellowship-class .col1,
  .view-record .col1 {
    flex: 1;
    margin-bottom: 0;
    }
  .view-fellowship-class .col2,
  .view-record .col2 {
    flex: 4;
    }
  }

.view-fellowship-class-fellow .name {
  font-size: 2.2em;
  font-weight: 700;
  line-height: 1.3em;
  margin: 0 0 0.5em 0;
  }

.view-fellowship-class-fellow .name a {
  text-decoration: none;
  }

.affiliations {
  margin-bottom: 1em;
  }

.affiliations .paragraph {
  margin-bottom: 0.5em;
  }

.page-node-type-record #main .layout .inner {
  width: 100%;
  }

.view-record-publication {
  margin-bottom: 0.2em;
  }

.view-record-publication .publication-title {
  font-size: 1.2em;
  font-weight: bold;
  }

.quote .views-field-body h3 {
  font-family: 'Crimson Pro', Georgia, Times, serif;
  font-weight: 200;
  }

.path-taxonomy .feed-icon {
  display: none;
  }


/* Pager */

#main .pager ul {
  margin: 2em;
  text-align: center;
  }

.pager li {
  background-image: none;
  display: inline;
  list-style-type: none;
  padding: 0.5em;
  padding-left: 0.5em;
  }

.pager__item.is-active {
  background: var(--light-grey);
  }


/* ----- Webform -----*/

a.button,
.form-submit {
  font-size: 1em;
  color: var(--white);
  background-color: var(--link);
  padding: 0.5em 1.0em;
  border: none;
  text-decoration: none;
  appearance: inherit !important;
  -webkit-appearance: inherit !important;
  }

input,
textarea,
select {
  width: 100%;
  font-size: 1em;
  padding: 0.2em 0.5em;
  }

input.button {
  width: fit-content
  }

.field--name-field-group-served legend {
  font-weight: bold;
  }

.webform-submission-form {
  padding: 2em;
  margin: 0 0 2em 0;
  background: var(--very-light-grey);
  }

.form-required {
  color: var(--green) !important;
  }


/* ----- User Profile ----- */

.path-user #main .layout .inner {
  width: 100%;
  }

.fellowship-class-content div {
  display: inline;
  }

.fellowship-class-label {
  font-weight: bold;
  margin: 0 1em 0 0;
  }

.user-fellowship-class {
  font-family: 'Mulish', Verdana, Arial, Helvetica, sans-serif;
  font-size: 0.9em;
  font-weight: bold;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  background: var(--very-light-grey);
  display: inline-block;
  line-height: 1.2em;
  padding: 0.5em 0 0.5em 1em;
  margin-bottom: 1em;
  }

.user-fellowship-class a {
  background: var(--blue);
  color: var(--white);
  padding: 0.5em 1em;
  margin-left: 1em;
  text-decoration: none;
  }

.user-professional-affiliations {
  margin-bottom: 1em;
  }

.user-professional-affiliation-label {
  font-size: 1.2em;
  margin-bottom: 0.2em
  }

.user-profile-field-label {
  width: 30%;
  padding: 0.5em 1em;
  background-color: var(--very-light-grey);
  border: 1px solid var(--light-grey);
  }

.user-profile-field-content {
  width: 70%;
  padding: 0.5em 1em;
  border: 1px solid var(--light-grey);
  }

.path-user fieldset {
  padding: 1em;
  border: 10px solid var(--light-blue);
  }

.path-user .fieldset-legend {
  font-weight: 600;
  font-size: 1.5em;
  }

.user-profile-fieldgroup {
  padding: 2em;
  border: 1px solid var(--light-grey);
  }

.user-profile-fieldgroup > legend {
  font-size: 1.2em;
  }

.user-bio {
  margin-bottom: 1em;
  }

.user-fellowship-project {

  }


/* ----- Footer ----- */

#footer {
  color: var(--white);
  font-size: 0.8em;
  padding: 3em 0;
  min-height: 50px;
  text-align: center;
  }

  #footer a {
    color: var(--white);
    }

  #footer .admin-login-link a {
    color: var(--link);
    }

  @media only screen and (min-width: 800px) {
    #footer {
      font-size: 1em;
      }
    }

#block-rye-footer {
  margin-bottom: 1em;
  }

.menu-footer li {
  display: inline-block;
  line-height: 1.2;
  padding: 0;
  }

.menu-footer li a {
  color: var(--white);
  padding: 0 1em;
  }