@-webkit-keyframes spin {
  0% {
    transform: rotate(0deg); }
  100% {
    transform: rotate(360deg); } }

@keyframes spin {
  0% {
    transform: rotate(0deg); }
  100% {
    transform: rotate(360deg); } }

/** Invert row order for mobile */
.employee-sidebar {
  grid-row: 2;
  padding-right: 2em; }
  .employee-sidebar .employee-sidebar__list {
    margin-top: 2em; }
  .employee-sidebar .employee-sidebar__list-header {
    border-bottom: 2px solid #dddddd;
    margin-bottom: 1em;
    padding-bottom: 0.6em;
    text-transform: uppercase;
    font-weight: 300; }
  @media screen and (min-width: 992px) {
    .employee-sidebar {
      grid-row: 1; } }

.employee-main__header {
  grid-row: 1;
  border-bottom: 2px solid #dddddd;
  margin-bottom: 1em;
  padding-bottom: 0.6em; }
  .employee-main__header h2,
  .employee-main__header h4 {
    text-transform: uppercase; }
  .employee-main__header h2 {
    font-size: 1.75rem; }
  .employee-main__header h4 {
    font-weight: 300;
    margin: 0.2em 0; }
  @media screen and (min-width: 992px) {
    .employee-main__header {
      grid-row: 2; } }

/** CARD display mode */
.employee-card {
  position: relative;
  max-width: 350px; }
  .employee-card .employee-card__container {
    background-color: rgba(0, 0, 0, 0.9);
    position: absolute;
    top: 270px;
    bottom: 0;
    width: 100%;
    overflow: hidden;
    text-align: center;
    color: #ffffff;
    transition: all 0.5s;
    transition-timing-function: ease-in-out;
    display: flex;
    flex-direction: column;
    padding: 1em; }
    @media (max-width: 1024px) {
      .employee-card .employee-card__container {
        top: unset;
        position: unset; } }
    .employee-card .employee-card__container.focused {
      top: 0; }
      .employee-card .employee-card__container.focused .focus-reveal {
        opacity: 1;
        max-height: 400px; }
    .employee-card .employee-card__container .focus-reveal {
      opacity: 0;
      max-height: 1px;
      transition: all 0.5s;
      transition-timing-function: ease-in-out; }
    .employee-card .employee-card__container .employee-card__center,
    .employee-card .employee-card__container .employee-card__bottom {
      margin-top: auto; }
    .employee-card .employee-card__container a {
      text-decoration: none;
      color: #ff4c00;
      font-weight: 500; }
      .employee-card .employee-card__container a:active, .employee-card .employee-card__container a:hover {
        text-decoration: underline; }
  .employee-card .employee-card__job-title {
    margin: 0.5rem 0 0;
    font-weight: 400; }
  .employee-card .employee-card__name {
    font-weight: 700;
    font-size: 1.4rem;
    margin: 0 auto;
    text-transform: uppercase; }
  .employee-card p {
    line-height: 1.4rem;
    font-weight: 300;
    padding: 0 1em; }