.page-people header a,
.page-people footer a {
  color: white;
}

.page-people .content-top {
  margin-top: 1rem;
}

.page-people .content-top h1 {
  color: white;
}

.page-people .content-top h1, .page-people .content-top h1 .text {
  text-align: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.page-people .content-center {
  margin-top: 0;
}

#bg-gradient {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  overflow: hidden;
  background-color: black;
  pointer-events: none;
}

#bg-gradient::after {
  content: '';
  position: absolute;
  top: -50vh;
  left: 0;
  width: 100vw;
  max-width: 100vw;
  height: 100vh;
  max-height: 100vh;
  z-index: 1;
  -webkit-transform: scale(5);
          transform: scale(5);
  background: #083954;
  background: radial-gradient(circle, #0F1B34 0%, #000000 25%);
}

@-webkit-keyframes personReveal {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-1.333rem);
            transform: translateY(-1.333rem);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}

@keyframes personReveal {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-1.333rem);
            transform: translateY(-1.333rem);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}

#list-people .item-person {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  width: calc(100% / 20 * 5);
  -ms-flex-line-pack: center;
      align-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-bottom: 2rem;
  opacity: 0;
}

#list-people .item-person .person-description {
  display: none;
}

#list-people .item-person .person-image-shape {
  -webkit-transform: scale(0.97) translateY(0.5rem);
          transform: scale(0.97) translateY(0.5rem);
}

#list-people .item-person .person-image-shape,
#list-people .item-person .person-name,
#list-people .item-person .person-position {
  -webkit-transform-origin: center bottom;
          transform-origin: center bottom;
  -webkit-transition: -webkit-transform .2s ease-out;
  transition: -webkit-transform .2s ease-out;
  transition: transform .2s ease-out;
  transition: transform .2s ease-out, -webkit-transform .2s ease-out;
}

#list-people .item-person .person-name,
#list-people .item-person .person-position {
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  text-align: center;
  -webkit-transform: translateY(-1rem);
          transform: translateY(-1rem);
}

#list-people .item-person .person-name {
  font-size: 1.333rem;
  color: white;
}

#list-people .item-person .person-position {
  font-size: 0.777rem;
  color: #E5E5E5;
  font-weight: 300;
}

#list-people .item-person:hover .person-image-shape, #list-people .item-person:focus .person-image-shape {
  -webkit-transform: translateY(0.333rem);
          transform: translateY(0.333rem);
}

#list-people .item-person:hover .person-name, #list-people .item-person:focus .person-name {
  -webkit-transform: translateY(-1.111rem);
          transform: translateY(-1.111rem);
}

@media (min-width: 1025px) {
  #list-people > .item-person:not(:nth-child(3n)) {
    margin-right: calc(100% / 20 * 5 / 2);
  }
}

#list-people > .item-person:nth-child(1) {
  -webkit-animation: personReveal 0.5s 0.1s ease-out 1 normal forwards;
          animation: personReveal 0.5s 0.1s ease-out 1 normal forwards;
}

#list-people > .item-person:nth-child(2) {
  -webkit-animation: personReveal 0.5s 0.2s ease-out 1 normal forwards;
          animation: personReveal 0.5s 0.2s ease-out 1 normal forwards;
}

#list-people > .item-person:nth-child(3) {
  -webkit-animation: personReveal 0.5s 0.3s ease-out 1 normal forwards;
          animation: personReveal 0.5s 0.3s ease-out 1 normal forwards;
}

#list-people > .item-person:nth-child(4) {
  -webkit-animation: personReveal 0.5s 0.4s ease-out 1 normal forwards;
          animation: personReveal 0.5s 0.4s ease-out 1 normal forwards;
}

#list-people > .item-person:nth-child(5) {
  -webkit-animation: personReveal 0.5s 0.5s ease-out 1 normal forwards;
          animation: personReveal 0.5s 0.5s ease-out 1 normal forwards;
}

#list-people > .item-person:nth-child(6) {
  -webkit-animation: personReveal 0.5s 0.6s ease-out 1 normal forwards;
          animation: personReveal 0.5s 0.6s ease-out 1 normal forwards;
}

#list-people > .item-person:nth-child(7) {
  -webkit-animation: personReveal 0.5s 0.7s ease-out 1 normal forwards;
          animation: personReveal 0.5s 0.7s ease-out 1 normal forwards;
}

#list-people > .item-person:nth-child(8) {
  -webkit-animation: personReveal 0.5s 0.8s ease-out 1 normal forwards;
          animation: personReveal 0.5s 0.8s ease-out 1 normal forwards;
}

#list-people > .item-person:nth-child(9) {
  -webkit-animation: personReveal 0.5s 0.9s ease-out 1 normal forwards;
          animation: personReveal 0.5s 0.9s ease-out 1 normal forwards;
}

#list-people > .item-person:nth-child(10) {
  -webkit-animation: personReveal 0.5s 1s ease-out 1 normal forwards;
          animation: personReveal 0.5s 1s ease-out 1 normal forwards;
}

#list-people > .item-person:nth-child(11) {
  -webkit-animation: personReveal 0.5s 1.1s ease-out 1 normal forwards;
          animation: personReveal 0.5s 1.1s ease-out 1 normal forwards;
}

#list-people > .item-person:nth-child(12) {
  -webkit-animation: personReveal 0.5s 1.2s ease-out 1 normal forwards;
          animation: personReveal 0.5s 1.2s ease-out 1 normal forwards;
}

#list-people > .item-person:nth-child(13) {
  -webkit-animation: personReveal 0.5s 1.3s ease-out 1 normal forwards;
          animation: personReveal 0.5s 1.3s ease-out 1 normal forwards;
}

#list-people > .item-person:nth-child(14) {
  -webkit-animation: personReveal 0.5s 1.4s ease-out 1 normal forwards;
          animation: personReveal 0.5s 1.4s ease-out 1 normal forwards;
}

#list-people > .item-person:nth-child(15) {
  -webkit-animation: personReveal 0.5s 1.5s ease-out 1 normal forwards;
          animation: personReveal 0.5s 1.5s ease-out 1 normal forwards;
}

#list-people > .item-person:nth-child(16) {
  -webkit-animation: personReveal 0.5s 1.6s ease-out 1 normal forwards;
          animation: personReveal 0.5s 1.6s ease-out 1 normal forwards;
}

#list-people > .item-person:nth-child(17) {
  -webkit-animation: personReveal 0.5s 1.7s ease-out 1 normal forwards;
          animation: personReveal 0.5s 1.7s ease-out 1 normal forwards;
}

#list-people > .item-person:nth-child(18) {
  -webkit-animation: personReveal 0.5s 1.8s ease-out 1 normal forwards;
          animation: personReveal 0.5s 1.8s ease-out 1 normal forwards;
}

#list-people > .item-person:nth-child(19) {
  -webkit-animation: personReveal 0.5s 1.9s ease-out 1 normal forwards;
          animation: personReveal 0.5s 1.9s ease-out 1 normal forwards;
}

#list-people > .item-person:nth-child(20) {
  -webkit-animation: personReveal 0.5s 2s ease-out 1 normal forwards;
          animation: personReveal 0.5s 2s ease-out 1 normal forwards;
}

#list-people > .item-person:nth-child(21) {
  -webkit-animation: personReveal 0.5s 2.1s ease-out 1 normal forwards;
          animation: personReveal 0.5s 2.1s ease-out 1 normal forwards;
}

#list-people > .item-person:nth-child(22) {
  -webkit-animation: personReveal 0.5s 2.2s ease-out 1 normal forwards;
          animation: personReveal 0.5s 2.2s ease-out 1 normal forwards;
}

#list-people > .item-person:nth-child(23) {
  -webkit-animation: personReveal 0.5s 2.3s ease-out 1 normal forwards;
          animation: personReveal 0.5s 2.3s ease-out 1 normal forwards;
}

#list-people > .item-person:nth-child(24) {
  -webkit-animation: personReveal 0.5s 2.4s ease-out 1 normal forwards;
          animation: personReveal 0.5s 2.4s ease-out 1 normal forwards;
}

#list-people > .item-person:nth-child(25) {
  -webkit-animation: personReveal 0.5s 2.5s ease-out 1 normal forwards;
          animation: personReveal 0.5s 2.5s ease-out 1 normal forwards;
}

#list-people > .item-person:nth-child(26) {
  -webkit-animation: personReveal 0.5s 2.6s ease-out 1 normal forwards;
          animation: personReveal 0.5s 2.6s ease-out 1 normal forwards;
}

#list-people > .item-person:nth-child(27) {
  -webkit-animation: personReveal 0.5s 2.7s ease-out 1 normal forwards;
          animation: personReveal 0.5s 2.7s ease-out 1 normal forwards;
}

#list-people > .item-person:nth-child(28) {
  -webkit-animation: personReveal 0.5s 2.8s ease-out 1 normal forwards;
          animation: personReveal 0.5s 2.8s ease-out 1 normal forwards;
}

#list-people > .item-person:nth-child(29) {
  -webkit-animation: personReveal 0.5s 2.9s ease-out 1 normal forwards;
          animation: personReveal 0.5s 2.9s ease-out 1 normal forwards;
}

#list-people > .item-person:nth-child(30) {
  -webkit-animation: personReveal 0.5s 3s ease-out 1 normal forwards;
          animation: personReveal 0.5s 3s ease-out 1 normal forwards;
}

@-webkit-keyframes personCloseReveal {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes personCloseReveal {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes personCloseHide {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes personCloseHide {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes personContentReveal {
  0% {
    -webkit-transform: translateX(100%);
            transform: translateX(100%);
  }
  100% {
    -webkit-transform: translateX(0%);
            transform: translateX(0%);
  }
}

@keyframes personContentReveal {
  0% {
    -webkit-transform: translateX(100%);
            transform: translateX(100%);
  }
  100% {
    -webkit-transform: translateX(0%);
            transform: translateX(0%);
  }
}

@-webkit-keyframes personContentHide {
  0% {
    -webkit-transform: translateX(0%);
            transform: translateX(0%);
  }
  100% {
    -webkit-transform: translateX(100%);
            transform: translateX(100%);
  }
}

@keyframes personContentHide {
  0% {
    -webkit-transform: translateX(0%);
            transform: translateX(0%);
  }
  100% {
    -webkit-transform: translateX(100%);
            transform: translateX(100%);
  }
}

@-webkit-keyframes personContentRevealMobile {
  0% {
    -webkit-transform: translateX(-100%);
            transform: translateX(-100%);
  }
  100% {
    -webkit-transform: translateX(0%);
            transform: translateX(0%);
  }
}

@keyframes personContentRevealMobile {
  0% {
    -webkit-transform: translateX(-100%);
            transform: translateX(-100%);
  }
  100% {
    -webkit-transform: translateX(0%);
            transform: translateX(0%);
  }
}

@-webkit-keyframes personContentHideMobile {
  0% {
    -webkit-transform: translateX(0%);
            transform: translateX(0%);
  }
  100% {
    -webkit-transform: translateX(-100%);
            transform: translateX(-100%);
  }
}

@keyframes personContentHideMobile {
  0% {
    -webkit-transform: translateX(0%);
            transform: translateX(0%);
  }
  100% {
    -webkit-transform: translateX(-100%);
            transform: translateX(-100%);
  }
}

body.person-mode {
  overflow: hidden;
}

body.person-mode #person-modal .person-image {
  opacity: 0;
  -webkit-animation: personCloseReveal .5s ease-out 1 normal forwards;
          animation: personCloseReveal .5s ease-out 1 normal forwards;
}

@media (min-width: 1025px) {
  body.person-mode #person-modal .person-content {
    -webkit-animation: personContentReveal .5s ease-out 1 normal forwards;
            animation: personContentReveal .5s ease-out 1 normal forwards;
  }
}

@media (max-width: 1024px) {
  body.person-mode #person-modal .person-content {
    -webkit-animation: personContentRevealMobile .5s ease-out 1 normal forwards;
            animation: personContentRevealMobile .5s ease-out 1 normal forwards;
  }
}

body.person-mode #person-modal .person-close {
  opacity: 0;
  -webkit-animation: personCloseReveal .3s .1s ease-out 1 normal forwards;
          animation: personCloseReveal .3s .1s ease-out 1 normal forwards;
}

@media (min-width: 1025px) {
  body.person-closing #person-modal .person-content {
    -webkit-animation: personContentHide .5s ease-out 1 normal forwards;
            animation: personContentHide .5s ease-out 1 normal forwards;
  }
}

@media (max-width: 1024px) {
  body.person-closing #person-modal .person-content {
    -webkit-animation: personContentHideMobile .5s ease-out 1 normal forwards;
            animation: personContentHideMobile .5s ease-out 1 normal forwards;
  }
}

body.person-closing #person-modal .person-close {
  opacity: 1;
  -webkit-animation: personCloseHide .3s .1s ease-out 1 normal forwards;
          animation: personCloseHide .3s .1s ease-out 1 normal forwards;
}

body:not(.person-mode) #person-modal {
  display: none;
}

#person-modal {
  z-index: 99;
  overflow-y: auto;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  overflow-x: hidden;
}

#person-modal, #person-modal .person-close {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

#person-modal .person-content {
  width: calc(100% / 36 * 18);
  min-height: 100vh;
  z-index: 15;
  background-color: black;
  overflow: hidden;
}

#person-modal .person-content::after {
  content: '';
  background: radial-gradient(circle, #0F1B34 0%, #000000 25%);
  top: 0;
  left: 0;
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: -1;
  -webkit-transform: scale(5) translateX(-5%);
          transform: scale(5) translateX(-5%);
}

#person-modal .person-info,
#person-modal .person-image {
  height: 26.666rem;
  width: 100%;
}

#person-modal .person-image {
  -o-object-fit: cover;
     object-fit: cover;
}

#person-modal .person-data {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  padding-right: calc(100% / 18 * 9);
}

#person-modal .person-data,
#person-modal .person-description {
  padding-left: calc(100% / 18 * 2);
  color: white;
}

#person-modal .person-name {
  font-size: 2.666rem;
  font-weight: 500;
  line-height: 130%;
  margin-bottom: .555rem;
}

#person-modal .person-position {
  font-size: 1.333rem;
}

#person-modal .person-position,
#person-modal .person-description {
  font-weight: 300;
}

#person-modal .person-description {
  padding-right: calc(100% / 18 * 2);
  padding-top: 3rem;
  padding-bottom: 3rem;
}

#person-modal .person-description > p:not(:last-child) {
  margin-bottom: 1rem;
}

#person-modal .person-close {
  z-index: 14;
  background-color: rgba(0, 0, 0, 0.84);
  cursor: pointer;
  border: none;
  outline: none;
}

#about-project {
  margin-top: 1rem;
  opacity: 0;
  -webkit-animation: personReveal .5s 2.2s ease-out 1 normal forwards;
          animation: personReveal .5s 2.2s ease-out 1 normal forwards;
}

#about-project > p {
  color: white;
  font-weight: 300;
}

#about-project > p:not(:last-child) {
  margin-bottom: 1rem;
}

@media (max-width: 1024px) {
  #list-people .item-person {
    width: calc((100% / 30 * 27) / 2);
    margin-bottom: 1rem;
  }
  #list-people .item-person .person-image-shape {
    width: 100%;
    height: auto;
    -o-object-fit: contain;
       object-fit: contain;
  }
  #list-people .item-person .person-name {
    font-size: 1rem;
  }
  #list-people .item-person .person-position {
    font-size: 0.666rem;
  }
  #list-people .item-person .person-name,
  #list-people .item-person .person-position {
    -webkit-transform: translateY(0rem);
            transform: translateY(0rem);
  }
  #list-people .item-person:hover .person-image-shape, #list-people .item-person:focus .person-image-shape {
    -webkit-transform: translateY(0.333rem);
            transform: translateY(0.333rem);
  }
  #list-people .item-person:hover .person-name, #list-people .item-person:focus .person-name {
    -webkit-transform: translateY(-0.333rem);
            transform: translateY(-0.333rem);
  }
  #list-people > .item-person:not(:nth-child(2n)) {
    margin-right: calc(100% / 30 * 3);
  }
  #person-modal {
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
  }
  #person-modal .person-info,
  #person-modal .person-image {
    height: 13.333rem;
  }
  #person-modal .person-content {
    width: calc(100% / 36 * 30);
  }
  #person-modal .person-name {
    font-size: 1.666rem;
    margin-bottom: 0;
  }
  #person-modal .person-position {
    font-size: 1rem;
  }
  #person-modal .person-data {
    padding-right: calc(100% / 30 * 15);
  }
  #person-modal .person-description {
    padding-right: calc(100% / 30 * 3);
    padding-top: 2rem;
    padding-bottom: 2rem;
  }
  #person-modal .person-data,
  #person-modal .person-description {
    padding-left: calc(100% / 30 * 3);
  }
}
/*# sourceMappingURL=people.css.map */