.flexslider_speakers .speaker .overlay {
  min-height: 8rem;
} 


.speakers-container {
margin: 2rem 0;
}

.speaker-grid {
  display: grid;
  --auto-grid-min-size: 26rem;
  grid-template-columns: repeat(auto-fill, minmax(var(--auto-grid-min-size), 1fr));
  grid-auto-rows: 1fr;
  grid-column-gap: 15px;
  grid-row-gap: 15px;
  margin-bottom: 2rem;
}

.adv-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-auto-rows: 1fr;
  grid-column-gap: 15px;
  grid-row-gap: 15px;
  margin-bottom: 2rem;
}

#speakers div,
#AdvisoryBoard a {

}

.speaker {
  background: var(--secondary);
  overflow: hidden;
  transition: transform 0.2s ease;
  border-radius: .4rem;

}


.speaker:hover {
  box-shadow: 0px 5px 25px #ccc;

}


.speaker:hover .overlay .inner {
  transition: all 0.6s ease;
  transform: translateY(-8rem);
  opacity: 0;
}

.speaker:hover .view-profile  {
  transition: all 0.2s ;
  bottom: 1rem;
  opacity: 1;
}

.speaker-image {
    position: relative;

}

.speaker-image .company-logo {
  display: flex;
  position: absolute;
  right: 1rem;
  bottom: -4rem;
  max-width: 8rem;
  z-index: 100;
  border-radius: 1rem;
  overflow: hidden;
  box-shadow: 0px 10px 15px -5px #111;
}


.speaker:hover .company-logo {
    -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation-timing-function: ease-in-out;
  animation-timing-function: ease-in-out;
  animation-iteration-count: once;
  -webkit-animation-iteration-count: once;
  cursor: pointer;
  animation-name: bounce;
  -moz-animation-name: bounce;
}



.speaker a {
  text-decoration: none;
  width: 100%;
  }

.speaker .speaker-headshot {
  width: 100%;
  height: auto;
  transition: transform 0.8s ease-in-out;
  transform: scale3d(1.0, 1.0, 1.0);

}

.speaker:hover .speaker-headshot {
  transform: scale3d(1.05, 1.05, 1.05);
}


.overlay {
  width: 100%;
  padding: 1rem;
  color: #fff;
  background: var(--secondary);
  font-size: 1.3rem;
  transform: translateY(-10px);
  height: 100%;
  overflow: hidden;
  transition: all 0.6s ease;
  opacity: 1;

}

.overlay-short {
  padding: 1rem 10rem 1rem 1rem;
}

.overlay .inner {
transform: translateY(0);
}

.overlay .name {
  font-family: 'proxima_nova_rgbold';
  font-size: 1.5rem;

}

.overlay i {
  font-style: italic;
  font-weight: 100;
}

.view-profile {
  position: absolute;
  bottom: -5rem;
  left: 1rem;
  color: #fff;
  opacity: 0;
}

@keyframes bounce {
  0%, 100%, 20%, 50%, 80% {
    -webkit-transform: translateY(0);
    -ms-transform:     translateY(0);
    transform:         translateY(0)
  }
  40% {
    -webkit-transform: translateY(-10px);
    -ms-transform:     translateY(-10px);
    transform:         translateY(-10px)
  }
  60% {
    -webkit-transform: translateY(-5px);
    -ms-transform:     translateY(-5px);
    transform:         translateY(-5px)
  }
}




@media screen and (max-width:57.5em) {

  .speaker-grid, .adv-grid  {
    grid-template-columns: repeat(2, 1fr);
  }

  .overlay-short {
    width: 100%;
    padding: 1rem 1rem;

  }

  .company-logo {
    display: none!important;
  }

}